diff --git a/build/caat-box2d-min.js b/build/caat-box2d-min.js index 45578518..81bbf5e2 100644 --- a/build/caat-box2d-min.js +++ b/build/caat-box2d-min.js @@ -22,11 +22,11 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -Version: 0.2 build: 17 +Version: 0.2 build: 19 Created on: DATE: 2012-01-22 -TIME: 17:56:52 +TIME: 18:10:16 */ diff --git a/build/caat-box2d.js b/build/caat-box2d.js index 0e559381..63acd508 100644 --- a/build/caat-box2d.js +++ b/build/caat-box2d.js @@ -21,11 +21,11 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -Version: 0.2 build: 18 +Version: 0.2 build: 20 Created on: DATE: 2012-01-22 -TIME: 17:57:15 +TIME: 18:10:40 */ diff --git a/build/caat-css-min.js b/build/caat-css-min.js index 66673b90..63e699cb 100644 --- a/build/caat-css-min.js +++ b/build/caat-css-min.js @@ -22,15 +22,15 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -Version: 0.2 build: 17 +Version: 0.2 build: 19 Created on: DATE: 2012-01-22 -TIME: 17:56:52 +TIME: 18:10:16 */ -var CAAT=CAAT||{};Function.prototype.bind=Function.prototype.bind||function(){var a=this,b=Array.prototype.slice.call(arguments),c=b.shift();return function(){return a.apply(c,b.concat(Array.prototype.slice.call(arguments)))}};CAAT.__CSS__=1;CAAT.__CSS__=1;CAAT.__CSS__=1;CAAT.__CSS__=1;CAAT.__CSS__=1;(function(){CAAT.BrowserDetect=function(){this.init();return this};CAAT.BrowserDetect.prototype={browser:"",version:0,OS:"",init:function(){this.browser=this.searchString(this.dataBrowser)||"An unknown browser";this.version=this.searchVersion(navigator.userAgent)||this.searchVersion(navigator.appVersion)||"an unknown version";this.OS=this.searchString(this.dataOS)||"an unknown OS"},searchString:function(a){for(var b=0;bd+this.range?this.minSize:a===d?this.maxSize:a=0;b--){var c=this.childrenList[b],d=new CAAT.Point(a.x,a.y,0),c=c.findActorAtPosition(d);if(null!==c)return c}return this},resetStats:function(){this.statistics.size_total=0;this.statistics.size_active=0;this.statistics.draws=0},render:function(a){this.time+=a;this.animate(this,a);CAAT.DEBUG&&this.resetStats();var b=this.childrenList.length,c,d,e,f=this.ctx;if(this.glEnabled){this.gl.clear(this.gl.COLOR_BUFFER_BIT| -this.gl.DEPTH_BUFFER_BIT);for(c=this.uvIndex=this.coordsIndex=0;c=this.dirtyRects.length)for(b=0;b<32;b++)this.dirtyRects.push(new CAAT.Rectangle);b=this.dirtyRects[this.dirtyRectsIndex];b.x=a.x;b.y=a.y;b.x1=a.x1;b.y1=a.y1;b.width=a.width;b.height=a.height;this.cDirtyRects.push(b)}},renderToContext:function(a,b){if(b.isInAnimationFrame(this.time)){a.globalAlpha=1;a.globalCompositeOperation= "source-over";a.clearRect(0,0,this.width,this.height);a.setTransform(1,0,0,0,1,0);var c=this.ctx,d=this.crc;this.ctx=this.crc=a;a.save();var e=this.worldModelViewMatrix;this.worldModelViewMatrix=new CAAT.Matrix;this.wdirty=true;b.animate(this,b.time);if(b.onRenderStart)b.onRenderStart(b.time);b.paintActor(this,b.time);if(b.onRenderEnd)b.onRenderEnd(b.time);this.worldModelViewMatrix=e;a.restore();this.ctx=c;this.crc=d}},addScene:function(a){a.setBounds(0,0,this.width,this.height);this.scenes.push(a); diff --git a/build/caat-css.js b/build/caat-css.js index 6225d111..35d79b6b 100644 --- a/build/caat-css.js +++ b/build/caat-css.js @@ -21,11 +21,11 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -Version: 0.2 build: 18 +Version: 0.2 build: 20 Created on: DATE: 2012-01-22 -TIME: 17:57:15 +TIME: 18:10:40 */ @@ -7563,6 +7563,7 @@ var cp1= proxy( CAAT.Director.CLEAR_DIRTY_RECTS= 1; CAAT.Director.CLEAR_ALL= true; + CAAT.Director.CLEAR_NONE= false; CAAT.Director.prototype = { @@ -8014,7 +8015,12 @@ var cp1= proxy( return this; }, - + /** + * + * Reset statistics information. + * + * @private + */ resetStats : function() { this.statistics.size_total= 0; this.statistics.size_active=0; @@ -8027,6 +8033,9 @@ var cp1= proxy( * This virtual timeline will provide each Scene with its own virtual timeline, and will only * feed time when the Scene is the current Scene, or is being switched. * + * If dirty rectangles are enabled and canvas is used for rendering, the dirty rectangles will be + * set up as a single clip area. + * * @param time {number} integer indicating the elapsed time between two consecutive frames of the * Director. */ @@ -8087,7 +8096,6 @@ var cp1= proxy( if ( this.dirtyRectsEnabled ) { ctx.beginPath(); -ctx.rect(0,0,100,40); var dr= this.cDirtyRects; for( i=0; id+this.range?this.minSize:a===d?this.maxSize:a=0;b--){var c=this.childrenList[b],d=new CAAT.Point(a.x,a.y,0),c=c.findActorAtPosition(d);if(null!==c)return c}return this},resetStats:function(){this.statistics.size_total=0;this.statistics.size_active=0;this.statistics.draws=0},render:function(a){this.time+=a;this.animate(this,a);CAAT.DEBUG&&this.resetStats();var b=this.childrenList.length,c,d,e,f=this.ctx;if(this.glEnabled){this.gl.clear(this.gl.COLOR_BUFFER_BIT| -this.gl.DEPTH_BUFFER_BIT);for(c=this.uvIndex=this.coordsIndex=0;c=this.dirtyRects.length)for(b=0;b<32;b++)this.dirtyRects.push(new CAAT.Rectangle);b=this.dirtyRects[this.dirtyRectsIndex];b.x=a.x;b.y=a.y;b.x1=a.x1;b.y1=a.y1;b.width=a.width;b.height=a.height;this.cDirtyRects.push(b)}},renderToContext:function(a,b){if(b.isInAnimationFrame(this.time)){a.globalAlpha=1;a.globalCompositeOperation= "source-over";a.clearRect(0,0,this.width,this.height);a.setTransform(1,0,0,0,1,0);var c=this.ctx,d=this.crc;this.ctx=this.crc=a;a.save();var e=this.worldModelViewMatrix;this.worldModelViewMatrix=new CAAT.Matrix;this.wdirty=true;b.animate(this,b.time);if(b.onRenderStart)b.onRenderStart(b.time);b.paintActor(this,b.time);if(b.onRenderEnd)b.onRenderEnd(b.time);this.worldModelViewMatrix=e;a.restore();this.ctx=c;this.crc=d}},addScene:function(a){a.setBounds(0,0,this.width,this.height);this.scenes.push(a); diff --git a/build/caat.js b/build/caat.js index 9cd4166a..ace2c45c 100644 --- a/build/caat.js +++ b/build/caat.js @@ -21,11 +21,11 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -Version: 0.2 build: 18 +Version: 0.2 build: 20 Created on: DATE: 2012-01-22 -TIME: 17:57:14 +TIME: 18:10:39 */ @@ -6245,7 +6245,7 @@ var cp1= proxy( } //if ( (CAAT.DEBUGAABB || glEnabled) && (this.dirty || this.wdirty ) ) { - // BUGBUG no hacer cuando no sea necesario. + // screen bounding boxes will always be calculated. if ( this.dirty || this.wdirty || this.invalid ) { if ( director.dirtyRectsEnabled ) { director.addDirtyRect( this.AABB ); @@ -8620,6 +8620,7 @@ var cp1= proxy( CAAT.Director.CLEAR_DIRTY_RECTS= 1; CAAT.Director.CLEAR_ALL= true; + CAAT.Director.CLEAR_NONE= false; CAAT.Director.prototype = { @@ -9071,7 +9072,12 @@ var cp1= proxy( return this; }, - + /** + * + * Reset statistics information. + * + * @private + */ resetStats : function() { this.statistics.size_total= 0; this.statistics.size_active=0; @@ -9084,6 +9090,9 @@ var cp1= proxy( * This virtual timeline will provide each Scene with its own virtual timeline, and will only * feed time when the Scene is the current Scene, or is being switched. * + * If dirty rectangles are enabled and canvas is used for rendering, the dirty rectangles will be + * set up as a single clip area. + * * @param time {number} integer indicating the elapsed time between two consecutive frames of the * Director. */ @@ -9144,7 +9153,6 @@ var cp1= proxy( if ( this.dirtyRectsEnabled ) { ctx.beginPath(); -ctx.rect(0,0,100,40); var dr= this.cDirtyRects; for( i=0; i/User
- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
\ No newline at end of file diff --git a/documentation/jsdoc/index.html b/documentation/jsdoc/index.html index 339aad00..34aae5a9 100644 --- a/documentation/jsdoc/index.html +++ b/documentation/jsdoc/index.html @@ -564,7 +564,7 @@

Function

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
\ No newline at end of file diff --git a/documentation/jsdoc/symbols/CAAT.Actor.html b/documentation/jsdoc/symbols/CAAT.Actor.html index 28e8aa1a..c25b0181 100644 --- a/documentation/jsdoc/symbols/CAAT.Actor.html +++ b/documentation/jsdoc/symbols/CAAT.Actor.html @@ -4570,7 +4570,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:45 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.ActorContainer.html b/documentation/jsdoc/symbols/CAAT.ActorContainer.html index 54f3fcb0..3f131be1 100644 --- a/documentation/jsdoc/symbols/CAAT.ActorContainer.html +++ b/documentation/jsdoc/symbols/CAAT.ActorContainer.html @@ -1418,7 +1418,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.AudioManager.html b/documentation/jsdoc/symbols/CAAT.AudioManager.html index d41233aa..2bf019be 100644 --- a/documentation/jsdoc/symbols/CAAT.AudioManager.html +++ b/documentation/jsdoc/symbols/CAAT.AudioManager.html @@ -1127,7 +1127,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.B2DBodyActor.html b/documentation/jsdoc/symbols/CAAT.B2DBodyActor.html index 27fc1324..db347ae5 100644 --- a/documentation/jsdoc/symbols/CAAT.B2DBodyActor.html +++ b/documentation/jsdoc/symbols/CAAT.B2DBodyActor.html @@ -1227,7 +1227,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.B2DCircularBody.html b/documentation/jsdoc/symbols/CAAT.B2DCircularBody.html index 5619382d..aa936ead 100644 --- a/documentation/jsdoc/symbols/CAAT.B2DCircularBody.html +++ b/documentation/jsdoc/symbols/CAAT.B2DCircularBody.html @@ -632,7 +632,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.B2DPolygonBody.html b/documentation/jsdoc/symbols/CAAT.B2DPolygonBody.html index 341ee2d7..a2f9e376 100644 --- a/documentation/jsdoc/symbols/CAAT.B2DPolygonBody.html +++ b/documentation/jsdoc/symbols/CAAT.B2DPolygonBody.html @@ -714,7 +714,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Bezier.html b/documentation/jsdoc/symbols/CAAT.Bezier.html index 00a09d85..cdf986f6 100644 --- a/documentation/jsdoc/symbols/CAAT.Bezier.html +++ b/documentation/jsdoc/symbols/CAAT.Bezier.html @@ -1022,7 +1022,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.CatmullRom.html b/documentation/jsdoc/symbols/CAAT.CatmullRom.html index e50a8e8b..ad37b50c 100644 --- a/documentation/jsdoc/symbols/CAAT.CatmullRom.html +++ b/documentation/jsdoc/symbols/CAAT.CatmullRom.html @@ -597,7 +597,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Color.RGB.html b/documentation/jsdoc/symbols/CAAT.Color.RGB.html index 8f1e583d..92b70fcd 100644 --- a/documentation/jsdoc/symbols/CAAT.Color.RGB.html +++ b/documentation/jsdoc/symbols/CAAT.Color.RGB.html @@ -470,7 +470,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Color.html b/documentation/jsdoc/symbols/CAAT.Color.html index fc2b0b64..ed5f4b11 100644 --- a/documentation/jsdoc/symbols/CAAT.Color.html +++ b/documentation/jsdoc/symbols/CAAT.Color.html @@ -694,7 +694,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:46 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Curve.html b/documentation/jsdoc/symbols/CAAT.Curve.html index a21b3c15..1ed2bb5e 100644 --- a/documentation/jsdoc/symbols/CAAT.Curve.html +++ b/documentation/jsdoc/symbols/CAAT.Curve.html @@ -969,7 +969,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:47 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.CurvePath.html b/documentation/jsdoc/symbols/CAAT.CurvePath.html index da0382ab..783bc270 100644 --- a/documentation/jsdoc/symbols/CAAT.CurvePath.html +++ b/documentation/jsdoc/symbols/CAAT.CurvePath.html @@ -1205,7 +1205,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:47 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:06 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Director.html b/documentation/jsdoc/symbols/CAAT.Director.html index 9504ecc9..638ea576 100644 --- a/documentation/jsdoc/symbols/CAAT.Director.html +++ b/documentation/jsdoc/symbols/CAAT.Director.html @@ -479,7 +479,7 @@

addDirtyRect(rectangle)
-
Before calling this method, check if this.dirtyRectsEnabled is true.
+
Add a rectangle to the list of dirty screen areas which should be redrawn.
@@ -937,11 +937,11 @@

-   + <private>  
resetStats()
-
+
Reset statistics information.
@@ -1693,7 +1693,17 @@

- Before calling this method, check if this.dirtyRectsEnabled is true. + Add a rectangle to the list of dirty screen areas which should be redrawn. +This is the opposite method to clear the whole screen and repaint everything again. +Despite i'm not very fond of dirty rectangles because it needs some extra calculations, this +procedure has shown to be speeding things up under certain situations. Nevertheless it doesn't or +even lowers performance under others, so it is a developer choice to activate them via a call to +setClear( CAAT.Director.CLEAR_DIRTY_RECTS ). + +This function, not only tracks a list of dirty rectangles, but tries to optimize the list. Overlapping +rectangles will be removed and intersecting ones will be unioned. + +Before calling this method, check if this.dirtyRectsEnabled is true.
@@ -3626,6 +3636,9 @@

The director is fed with the elapsed time value to maintain a virtual timeline. This virtual timeline will provide each Scene with its own virtual timeline, and will only feed time when the Scene is the current Scene, or is being switched. + +If dirty rectangles are enabled and canvas is used for rendering, the dirty rectangles will be +set up as a single clip area. @@ -3754,14 +3767,14 @@

-
+
<private> resetStats()
- + Reset statistics information.
@@ -3849,6 +3862,12 @@

This method states whether the director must clear background before rendering each frame. + +The clearing method could be: + + CAAT.Director.CLEAR_ALL. previous to draw anything on screen the canvas will have clearRect called on it. + + CAAT.Director.CLEAR_DIRTY_RECTS. Actors marked as invalid, or which have been moved, rotated or scaled + will have their areas redrawn. + + CAAT.Director.CLEAR_NONE. clears nothing.
@@ -3863,7 +3882,7 @@

clear -
{boolean} a boolean indicating whether to clear the screen before scene draw.
+
{CAAT.Director.CLEAR_ALL |�CAAT.Director.CLEAR_NONE | CAAT.Director.CLEAR_DIRTY_RECTS}
@@ -4406,7 +4425,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:48 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Font.html b/documentation/jsdoc/symbols/CAAT.Font.html new file mode 100644 index 00000000..bf5ea93d --- /dev/null +++ b/documentation/jsdoc/symbols/CAAT.Font.html @@ -0,0 +1,920 @@ + + + + + + + JsDoc Reference - CAAT.Font + + + + + + + + + + + + + +
+ +

+ + Class CAAT.Font +

+ + +

+ + + + + + +
Defined in: font.js. + +

+ + + + + + + + + + + + + + + + + +
Class Summary
Constructor AttributesConstructor Name and Description
  +
+ CAAT.Font() +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Method Summary
Method AttributesMethod Name and Description
  +
create(chars, padding) +
+
+
  +
createDefault(padding) +
+
+
  +
drawText(str, ctx, x, y) +
+
+
  +
save() +
+
+
  +
setFillStyle(style) +
+
+
  +
setFont(font) +
+
+
  +
setFontSize(fontSize) +
+
+
  +
setFontStyle(style) +
+
+
  +
setPadding(padding) +
+
+
  +
setStrokeStyle(style) +
+
+
  +
stringWidth(str) +
+
+
+ + + + + + + + + +
+
+ Class Detail +
+ +
+ CAAT.Font() +
+ +
+ + +
+ + + + + + + + + + + + +
+ + + + + + + +
+ Method Detail +
+ + +
+ + + create(chars, padding) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ chars + +
+
+ +
+ padding + +
+
+ +
+ + + + + + + + +
+ + +
+ + + createDefault(padding) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ padding + +
+
+ +
+ + + + + + + + +
+ + +
+ + + drawText(str, ctx, x, y) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ str + +
+
+ +
+ ctx + +
+
+ +
+ x + +
+
+ +
+ y + +
+
+ +
+ + + + + + + + +
+ + +
+ + + save() + +
+
+ + + +
+ + + + + + + + + + + +
+ + +
+ + + setFillStyle(style) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ style + +
+
+ +
+ + + + + + + + +
+ + +
+ + + setFont(font) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ font + +
+
+ +
+ + + + + + + + +
+ + +
+ + + setFontSize(fontSize) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ fontSize + +
+
+ +
+ + + + + + + + +
+ + +
+ + + setFontStyle(style) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ style + +
+
+ +
+ + + + + + + + +
+ + +
+ + + setPadding(padding) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ padding + +
+
+ +
+ + + + + + + + +
+ + +
+ + + setStrokeStyle(style) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ style + +
+
+ +
+ + + + + + + + +
+ + +
+ + + stringWidth(str) + +
+
+ + + +
+ + + + +
+
Parameters:
+ +
+ str + +
+
+ +
+ + + + + + + + + + + + + + + +
+
+ + + +
+ + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET) +
+ + diff --git a/documentation/jsdoc/symbols/CAAT.IMActor.html b/documentation/jsdoc/symbols/CAAT.IMActor.html index b7fef731..71f6f17b 100644 --- a/documentation/jsdoc/symbols/CAAT.IMActor.html +++ b/documentation/jsdoc/symbols/CAAT.IMActor.html @@ -553,7 +553,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:48 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.IMBump.html b/documentation/jsdoc/symbols/CAAT.IMBump.html index 5646758b..5372a2ae 100644 --- a/documentation/jsdoc/symbols/CAAT.IMBump.html +++ b/documentation/jsdoc/symbols/CAAT.IMBump.html @@ -819,7 +819,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:48 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.IMPlasma.html b/documentation/jsdoc/symbols/CAAT.IMPlasma.html index 71cf7498..b02b6444 100644 --- a/documentation/jsdoc/symbols/CAAT.IMPlasma.html +++ b/documentation/jsdoc/symbols/CAAT.IMPlasma.html @@ -574,7 +574,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:48 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.IMRotoZoom.html b/documentation/jsdoc/symbols/CAAT.IMRotoZoom.html index 9f12a21e..5ab7c789 100644 --- a/documentation/jsdoc/symbols/CAAT.IMRotoZoom.html +++ b/documentation/jsdoc/symbols/CAAT.IMRotoZoom.html @@ -620,7 +620,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:48 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.ImagePreloader.html b/documentation/jsdoc/symbols/CAAT.ImagePreloader.html index e25e2040..a5cd6f38 100644 --- a/documentation/jsdoc/symbols/CAAT.ImagePreloader.html +++ b/documentation/jsdoc/symbols/CAAT.ImagePreloader.html @@ -476,7 +476,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:48 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.ImageProcessor.html b/documentation/jsdoc/symbols/CAAT.ImageProcessor.html index 446bec48..35f4368b 100644 --- a/documentation/jsdoc/symbols/CAAT.ImageProcessor.html +++ b/documentation/jsdoc/symbols/CAAT.ImageProcessor.html @@ -960,7 +960,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:48 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Interpolator.html b/documentation/jsdoc/symbols/CAAT.Interpolator.html index e41f721c..113e9961 100644 --- a/documentation/jsdoc/symbols/CAAT.Interpolator.html +++ b/documentation/jsdoc/symbols/CAAT.Interpolator.html @@ -1355,7 +1355,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:48 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:07 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.InterpolatorActor.html b/documentation/jsdoc/symbols/CAAT.InterpolatorActor.html index 7c6b0ecc..dece0cc1 100644 --- a/documentation/jsdoc/symbols/CAAT.InterpolatorActor.html +++ b/documentation/jsdoc/symbols/CAAT.InterpolatorActor.html @@ -615,7 +615,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:49 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.KeyEvent.html b/documentation/jsdoc/symbols/CAAT.KeyEvent.html new file mode 100644 index 00000000..6eedfba2 --- /dev/null +++ b/documentation/jsdoc/symbols/CAAT.KeyEvent.html @@ -0,0 +1,713 @@ + + + + + + + JsDoc Reference - CAAT.KeyEvent + + + + + + + + + + + + + +
+ +

+ + Class CAAT.KeyEvent +

+ + +

+ + + + + + +
Defined in: mouseevent.js. + +

+ + + + + + + + + + + + + + + + + +
Class Summary
Constructor AttributesConstructor Name and Description
  +
+ CAAT.KeyEvent(keyCode, up_or_down, modifiers, originalEvent) +
+
Define a key event.
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Method Summary
Method AttributesMethod Name and Description
  +
getAction() +
+
+
  +
getKeyCode() +
+
+
  +
getSourceEvent() +
+
+
  +
isAltPressed() +
+
+
  +
isControlPressed() +
+
+
  +
isShiftPressed() +
+
+
  +
modifiers() +
+
+
  +
preventDefault() +
+
+
+ + + + + + + + + +
+
+ Class Detail +
+ +
+ CAAT.KeyEvent(keyCode, up_or_down, modifiers, originalEvent) +
+ +
+ Define a key event. + +
+ + + + + +
+
Parameters:
+ +
+ keyCode + +
+
+ +
+ up_or_down + +
+
+ +
+ modifiers + +
+
+ +
+ originalEvent + +
+
+ +
+ + + + + + + + +
+ + + + + + + +
+ Method Detail +
+ + +
+ + + getAction() + +
+
+ + + +
+ + + + + + + + + + + +
+ + +
+ + + getKeyCode() + +
+
+ + + +
+ + + + + + + + + + + +
+ + +
+ + + getSourceEvent() + +
+
+ + + +
+ + + + + + + + + + + +
+ + +
+ + + isAltPressed() + +
+
+ + + +
+ + + + + + + + + + + +
+ + +
+ + + isControlPressed() + +
+
+ + + +
+ + + + + + + + + + + +
+ + +
+ + + isShiftPressed() + +
+
+ + + +
+ + + + + + + + + + + +
+ + +
+ + + modifiers() + +
+
+ + + +
+ + + + + + + + + + + +
+ + +
+ + + preventDefault() + +
+
+ + + +
+ + + + + + + + + + + + + + + + + + +
+
+ + + +
+ + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET) +
+ + diff --git a/documentation/jsdoc/symbols/CAAT.LinearPath.html b/documentation/jsdoc/symbols/CAAT.LinearPath.html index 003a663f..d85fca74 100644 --- a/documentation/jsdoc/symbols/CAAT.LinearPath.html +++ b/documentation/jsdoc/symbols/CAAT.LinearPath.html @@ -1079,7 +1079,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:49 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Matrix3.html b/documentation/jsdoc/symbols/CAAT.Matrix3.html index eeab15b4..c1e7dbb6 100644 --- a/documentation/jsdoc/symbols/CAAT.Matrix3.html +++ b/documentation/jsdoc/symbols/CAAT.Matrix3.html @@ -1615,7 +1615,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:49 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.MatrixStack.html b/documentation/jsdoc/symbols/CAAT.MatrixStack.html index fbc87a5a..ea55b538 100644 --- a/documentation/jsdoc/symbols/CAAT.MatrixStack.html +++ b/documentation/jsdoc/symbols/CAAT.MatrixStack.html @@ -624,7 +624,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:49 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.MouseEvent.html b/documentation/jsdoc/symbols/CAAT.MouseEvent.html index 138bbcb9..70cd52f3 100644 --- a/documentation/jsdoc/symbols/CAAT.MouseEvent.html +++ b/documentation/jsdoc/symbols/CAAT.MouseEvent.html @@ -651,7 +651,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:50 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Path.html b/documentation/jsdoc/symbols/CAAT.Path.html index 4153cb37..b05d74c9 100644 --- a/documentation/jsdoc/symbols/CAAT.Path.html +++ b/documentation/jsdoc/symbols/CAAT.Path.html @@ -2981,7 +2981,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:50 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.PathActor.html b/documentation/jsdoc/symbols/CAAT.PathActor.html index f429e9b5..1d4cfb13 100644 --- a/documentation/jsdoc/symbols/CAAT.PathActor.html +++ b/documentation/jsdoc/symbols/CAAT.PathActor.html @@ -788,7 +788,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:50 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.PathSegment.html b/documentation/jsdoc/symbols/CAAT.PathSegment.html index a643e887..a28c7545 100644 --- a/documentation/jsdoc/symbols/CAAT.PathSegment.html +++ b/documentation/jsdoc/symbols/CAAT.PathSegment.html @@ -1147,7 +1147,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:50 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Point.html b/documentation/jsdoc/symbols/CAAT.Point.html index bd6a9038..5129fc8d 100644 --- a/documentation/jsdoc/symbols/CAAT.Point.html +++ b/documentation/jsdoc/symbols/CAAT.Point.html @@ -1271,7 +1271,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:50 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Rectangle.html b/documentation/jsdoc/symbols/CAAT.Rectangle.html index d7a59eb6..f63e105e 100644 --- a/documentation/jsdoc/symbols/CAAT.Rectangle.html +++ b/documentation/jsdoc/symbols/CAAT.Rectangle.html @@ -845,7 +845,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:50 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.Scene.html b/documentation/jsdoc/symbols/CAAT.Scene.html index 362f1733..8d9a0097 100644 --- a/documentation/jsdoc/symbols/CAAT.Scene.html +++ b/documentation/jsdoc/symbols/CAAT.Scene.html @@ -1748,7 +1748,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.ShapeActor.html b/documentation/jsdoc/symbols/CAAT.ShapeActor.html index 8feedf0f..a4fa78ff 100644 --- a/documentation/jsdoc/symbols/CAAT.ShapeActor.html +++ b/documentation/jsdoc/symbols/CAAT.ShapeActor.html @@ -990,7 +990,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.SpriteImage.html b/documentation/jsdoc/symbols/CAAT.SpriteImage.html index 46bc76fa..ecd4ecb8 100644 --- a/documentation/jsdoc/symbols/CAAT.SpriteImage.html +++ b/documentation/jsdoc/symbols/CAAT.SpriteImage.html @@ -1899,7 +1899,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.StarActor.html b/documentation/jsdoc/symbols/CAAT.StarActor.html index 5949cb0d..05aa4b67 100644 --- a/documentation/jsdoc/symbols/CAAT.StarActor.html +++ b/documentation/jsdoc/symbols/CAAT.StarActor.html @@ -1032,7 +1032,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.TextActor.html b/documentation/jsdoc/symbols/CAAT.TextActor.html index 1d04a1d5..2bae5cb6 100644 --- a/documentation/jsdoc/symbols/CAAT.TextActor.html +++ b/documentation/jsdoc/symbols/CAAT.TextActor.html @@ -1123,7 +1123,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.TimerTask.html b/documentation/jsdoc/symbols/CAAT.TimerTask.html index c67ff550..296070aa 100644 --- a/documentation/jsdoc/symbols/CAAT.TimerTask.html +++ b/documentation/jsdoc/symbols/CAAT.TimerTask.html @@ -646,7 +646,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.html b/documentation/jsdoc/symbols/CAAT.html index d1b00b3c..18d30769 100644 --- a/documentation/jsdoc/symbols/CAAT.html +++ b/documentation/jsdoc/symbols/CAAT.html @@ -1875,7 +1875,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:44 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:05 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.modules.CircleManager.PackedCircle.html b/documentation/jsdoc/symbols/CAAT.modules.CircleManager.PackedCircle.html index f353e497..7a788a52 100644 --- a/documentation/jsdoc/symbols/CAAT.modules.CircleManager.PackedCircle.html +++ b/documentation/jsdoc/symbols/CAAT.modules.CircleManager.PackedCircle.html @@ -1025,7 +1025,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:49 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.modules.CircleManager.PackedCircleManager.html b/documentation/jsdoc/symbols/CAAT.modules.CircleManager.PackedCircleManager.html index 0714d748..7a650b73 100644 --- a/documentation/jsdoc/symbols/CAAT.modules.CircleManager.PackedCircleManager.html +++ b/documentation/jsdoc/symbols/CAAT.modules.CircleManager.PackedCircleManager.html @@ -1054,7 +1054,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:50 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.modules.CircleManager.html b/documentation/jsdoc/symbols/CAAT.modules.CircleManager.html index 728842cd..31c5fed0 100644 --- a/documentation/jsdoc/symbols/CAAT.modules.CircleManager.html +++ b/documentation/jsdoc/symbols/CAAT.modules.CircleManager.html @@ -383,7 +383,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:49 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.modules.LocalStorage.html b/documentation/jsdoc/symbols/CAAT.modules.LocalStorage.html index 8cc6beca..9c77844f 100644 --- a/documentation/jsdoc/symbols/CAAT.modules.LocalStorage.html +++ b/documentation/jsdoc/symbols/CAAT.modules.LocalStorage.html @@ -568,7 +568,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:50 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/CAAT.modules.html b/documentation/jsdoc/symbols/CAAT.modules.html index d54bea93..647e58a3 100644 --- a/documentation/jsdoc/symbols/CAAT.modules.html +++ b/documentation/jsdoc/symbols/CAAT.modules.html @@ -476,7 +476,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:49 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:08 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/Function.html b/documentation/jsdoc/symbols/Function.html index 2fdda1a8..2a273771 100644 --- a/documentation/jsdoc/symbols/Function.html +++ b/documentation/jsdoc/symbols/Function.html @@ -392,7 +392,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:51 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:09 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/_global_.html b/documentation/jsdoc/symbols/_global_.html index c1c6f2b0..a329f0f3 100644 --- a/documentation/jsdoc/symbols/_global_.html +++ b/documentation/jsdoc/symbols/_global_.html @@ -712,7 +712,7 @@

- Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 17:57:44 GMT+0100 (CET) + Documentation generated by JsDoc Toolkit 2.4.0 on Sun Jan 22 2012 18:11:05 GMT+0100 (CET)
diff --git a/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_math_rectangle.js.html b/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_math_rectangle.js.html index 8462b3c3..c32fbfe7 100644 --- a/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_math_rectangle.js.html +++ b/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_math_rectangle.js.html @@ -130,6 +130,22 @@ 123 this.union( rectangle.x, rectangle.y1 ); 124 this.union( rectangle.x1, rectangle.y1 ); 125 return this; -126 } -127 }; -128 })(); \ No newline at end of file +126 }, +127 intersects : function( r ) { +128 if ( r.x1< this.x ) { +129 return false; +130 } +131 if ( r.x > this.x1 ) { +132 return false; +133 } +134 if ( r.y1< this.y ) { +135 return false; +136 } +137 if ( r.y> this.y1 ) { +138 return false; +139 } +140 +141 return true; +142 } +143 }; +144 })(); \ No newline at end of file diff --git a/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_model_actor.js.html b/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_model_actor.js.html index 479c743f..0ee9994f 100644 --- a/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_model_actor.js.html +++ b/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_model_actor.js.html @@ -48,2809 +48,2825 @@ 41 ]; 42 43 this.scaleAnchor= this.ANCHOR_CENTER; - 44 this.rotateAnchor= this.ANCHOR_CENTER; - 45 - 46 this.modelViewMatrix= new CAAT.Matrix(); - 47 this.worldModelViewMatrix= new CAAT.Matrix(); - 48 /* - 49 this.modelViewMatrixI= new CAAT.Matrix(); - 50 this.worldModelViewMatrixI= new CAAT.Matrix(); - 51 this.tmpMatrix= new CAAT.Matrix(); - 52 */ - 53 - 54 this.resetTransform(); - 55 this.setScale(1,1); - 56 this.setRotation(0); - 57 - 58 return this; - 59 }; - 60 - 61 CAAT.Actor.ANCHOR_CENTER= 0; // constant values to determine different affine transform - 62 CAAT.Actor.ANCHOR_TOP= 1; // anchors. - 63 CAAT.Actor.ANCHOR_BOTTOM= 2; - 64 CAAT.Actor.ANCHOR_LEFT= 3; - 65 CAAT.Actor.ANCHOR_RIGHT= 4; - 66 CAAT.Actor.ANCHOR_TOP_LEFT= 5; - 67 CAAT.Actor.ANCHOR_TOP_RIGHT= 6; - 68 CAAT.Actor.ANCHOR_BOTTOM_LEFT= 7; - 69 CAAT.Actor.ANCHOR_BOTTOM_RIGHT= 8; - 70 CAAT.Actor.ANCHOR_CUSTOM= 9; - 71 - 72 CAAT.Actor.prototype= { - 73 - 74 // tmpMatrix : null, - 75 - 76 lifecycleListenerList: null, // Array of life cycle listener - 77 - 78 behaviorList: null, // Array of behaviors to apply to the Actor - 79 parent: null, // Parent of this Actor. May be Scene. - 80 x: 0, // x position on parent. In parent's local coord. system. - 81 y: 0, // y position on parent. In parent's local coord. system. - 82 width: 0, // Actor's width. In parent's local coord. system. - 83 height: 0, // Actor's height. In parent's local coord. system. - 84 start_time: 0, // Start time in Scene time. - 85 duration: Number.MAX_VALUE, // Actor duration in Scene time - 86 clip: false, // should clip the Actor's content against its contour. - 87 clipPath: null, - 88 - 89 scaleX: 0, // transformation. width scale parameter - 90 scaleY: 0, // transformation. height scale parameter - 91 scaleTX: .50, // transformation. scale anchor x position - 92 scaleTY: .50, // transformation. scale anchor y position - 93 scaleAnchor: 0, // transformation. scale anchor - 94 rotationAngle: 0, // transformation. rotation angle in radians - 95 rotationY: .50, // transformation. rotation center y - 96 alpha: 1, // alpha transparency value - 97 rotationX: .50, // transformation. rotation center x - 98 isGlobalAlpha: false, // is this a global alpha - 99 frameAlpha: 1, // hierarchically calculated alpha for this Actor. -100 expired: false, // set when the actor has been expired -101 discardable: false, // set when you want this actor to be removed if expired -102 pointed: false, // is the mouse pointer inside this actor -103 mouseEnabled: true, // events enabled ? -104 -105 visible: true, -106 -107 ANCHOR_CENTER: 0, // constant values to determine different affine transform -108 ANCHOR_TOP: 1, // anchors. -109 ANCHOR_BOTTOM: 2, -110 ANCHOR_LEFT: 3, -111 ANCHOR_RIGHT: 4, -112 ANCHOR_TOP_LEFT: 5, -113 ANCHOR_TOP_RIGHT: 6, -114 ANCHOR_BOTTOM_LEFT: 7, -115 ANCHOR_BOTTOM_RIGHT: 8, -116 ANCHOR_CUSTOM: 9, -117 -118 fillStyle: null, // any canvas rendering valid fill style. -119 strokeStyle: null, // any canvas rendering valid stroke style. -120 time: 0, // Cache Scene time. -121 AABB: null, // CAAT.Rectangle -122 viewVertices: null, // model to view transformed vertices. -123 inFrame: false, // boolean indicating whether this Actor was present on last frame. -124 -125 dirty: true, // model view is dirty ? -126 wdirty: true, // world model view is dirty ? -127 oldX: -1, -128 oldY: -1, -129 -130 modelViewMatrix: null, // model view matrix. -131 worldModelViewMatrix: null, // world model view matrix. -132 modelViewMatrixI: null, // model view matrix. -133 worldModelViewMatrixI: null, // world model view matrix. -134 -135 glEnabled: false, -136 -137 backgroundImage: null, -138 id: null, -139 -140 size_active: 1, // number of animated children -141 size_total: 1, -142 -143 __next: null, -144 -145 __d_ax: -1, // for drag-enabled actors. -146 __d_ay: -1, -147 gestureEnabled: false, -148 -149 setGestureEnabled : function( enable ) { -150 this.gestureEnabled= !!enable; -151 }, -152 isGestureEnabled : function() { -153 return this.gestureEnabled; -154 }, -155 getId : function() { -156 return this.id; -157 }, -158 setId : function(id) { -159 this.id= id; -160 return this; + 44 + 45 this.modelViewMatrix= new CAAT.Matrix(); + 46 this.worldModelViewMatrix= new CAAT.Matrix(); + 47 /* + 48 this.modelViewMatrixI= new CAAT.Matrix(); + 49 this.worldModelViewMatrixI= new CAAT.Matrix(); + 50 this.tmpMatrix= new CAAT.Matrix(); + 51 */ + 52 + 53 this.resetTransform(); + 54 this.setScale(1,1); + 55 this.setRotation(0); + 56 + 57 return this; + 58 }; + 59 + 60 CAAT.Actor.ANCHOR_CENTER= 0; // constant values to determine different affine transform + 61 CAAT.Actor.ANCHOR_TOP= 1; // anchors. + 62 CAAT.Actor.ANCHOR_BOTTOM= 2; + 63 CAAT.Actor.ANCHOR_LEFT= 3; + 64 CAAT.Actor.ANCHOR_RIGHT= 4; + 65 CAAT.Actor.ANCHOR_TOP_LEFT= 5; + 66 CAAT.Actor.ANCHOR_TOP_RIGHT= 6; + 67 CAAT.Actor.ANCHOR_BOTTOM_LEFT= 7; + 68 CAAT.Actor.ANCHOR_BOTTOM_RIGHT= 8; + 69 CAAT.Actor.ANCHOR_CUSTOM= 9; + 70 + 71 CAAT.Actor.prototype= { + 72 + 73 // tmpMatrix : null, + 74 + 75 lifecycleListenerList: null, // Array of life cycle listener + 76 + 77 behaviorList: null, // Array of behaviors to apply to the Actor + 78 parent: null, // Parent of this Actor. May be Scene. + 79 x: 0, // x position on parent. In parent's local coord. system. + 80 y: 0, // y position on parent. In parent's local coord. system. + 81 width: 0, // Actor's width. In parent's local coord. system. + 82 height: 0, // Actor's height. In parent's local coord. system. + 83 start_time: 0, // Start time in Scene time. + 84 duration: Number.MAX_VALUE, // Actor duration in Scene time + 85 clip: false, // should clip the Actor's content against its contour. + 86 clipPath: null, + 87 + 88 scaleX: 0, // transformation. width scale parameter + 89 scaleY: 0, // transformation. height scale parameter + 90 scaleTX: .50, // transformation. scale anchor x position + 91 scaleTY: .50, // transformation. scale anchor y position + 92 scaleAnchor: 0, // transformation. scale anchor + 93 rotationAngle: 0, // transformation. rotation angle in radians + 94 rotationY: .50, // transformation. rotation center y + 95 alpha: 1, // alpha transparency value + 96 rotationX: .50, // transformation. rotation center x + 97 isGlobalAlpha: false, // is this a global alpha + 98 frameAlpha: 1, // hierarchically calculated alpha for this Actor. + 99 expired: false, // set when the actor has been expired +100 discardable: false, // set when you want this actor to be removed if expired +101 pointed: false, // is the mouse pointer inside this actor +102 mouseEnabled: true, // events enabled ? +103 +104 visible: true, +105 +106 ANCHOR_CENTER: 0, // constant values to determine different affine transform +107 ANCHOR_TOP: 1, // anchors. +108 ANCHOR_BOTTOM: 2, +109 ANCHOR_LEFT: 3, +110 ANCHOR_RIGHT: 4, +111 ANCHOR_TOP_LEFT: 5, +112 ANCHOR_TOP_RIGHT: 6, +113 ANCHOR_BOTTOM_LEFT: 7, +114 ANCHOR_BOTTOM_RIGHT: 8, +115 ANCHOR_CUSTOM: 9, +116 +117 fillStyle: null, // any canvas rendering valid fill style. +118 strokeStyle: null, // any canvas rendering valid stroke style. +119 time: 0, // Cache Scene time. +120 AABB: null, // CAAT.Rectangle +121 viewVertices: null, // model to view transformed vertices. +122 inFrame: false, // boolean indicating whether this Actor was present on last frame. +123 +124 dirty: true, // model view is dirty ? +125 wdirty: true, // world model view is dirty ? +126 oldX: -1, +127 oldY: -1, +128 +129 modelViewMatrix: null, // model view matrix. +130 worldModelViewMatrix: null, // world model view matrix. +131 modelViewMatrixI: null, // model view matrix. +132 worldModelViewMatrixI: null, // world model view matrix. +133 +134 glEnabled: false, +135 +136 backgroundImage: null, +137 id: null, +138 +139 size_active: 1, // number of animated children +140 size_total: 1, +141 +142 __next: null, +143 +144 __d_ax: -1, // for drag-enabled actors. +145 __d_ay: -1, +146 gestureEnabled: false, +147 +148 invalid : true, +149 +150 invalidate : function() { +151 this.invalid= true; +152 }, +153 setGestureEnabled : function( enable ) { +154 this.gestureEnabled= !!enable; +155 }, +156 isGestureEnabled : function() { +157 return this.gestureEnabled; +158 }, +159 getId : function() { +160 return this.id; 161 }, -162 /** -163 * Set this actor's parent. -164 * @param parent {CAAT.ActorContainer} -165 * @return this -166 */ -167 setParent : function(parent) { -168 this.parent= parent; -169 return this; -170 }, -171 /** -172 * Set this actor's background image. -173 * The need of a background image is to kept compatibility with the new CSSDirector class. -174 * The image parameter can be either an Image/Canvas or a CAAT.SpriteImage instance. If an image -175 * is supplied, it will be wrapped into a CAAT.SriteImage instance of 1 row by 1 column. -176 * If the actor has set an image in the background, the paint method will draw the image, otherwise -177 * and if set, will fill its background with a solid color. -178 * If adjust_size_to_image is true, the host actor will be redimensioned to the size of one -179 * single image from the SpriteImage (either supplied or generated because of passing an Image or -180 * Canvas to the function). That means the size will be set to [width:SpriteImage.singleWidth, -181 * height:singleHeight]. -182 * -183 * WARN: if using a CSS renderer, the image supplied MUST be a HTMLImageElement instance. -184 * -185 * @see CAAT.SpriteImage +162 setId : function(id) { +163 this.id= id; +164 return this; +165 }, +166 /** +167 * Set this actor's parent. +168 * @param parent {CAAT.ActorContainer} +169 * @return this +170 */ +171 setParent : function(parent) { +172 this.parent= parent; +173 return this; +174 }, +175 /** +176 * Set this actor's background image. +177 * The need of a background image is to kept compatibility with the new CSSDirector class. +178 * The image parameter can be either an Image/Canvas or a CAAT.SpriteImage instance. If an image +179 * is supplied, it will be wrapped into a CAAT.SriteImage instance of 1 row by 1 column. +180 * If the actor has set an image in the background, the paint method will draw the image, otherwise +181 * and if set, will fill its background with a solid color. +182 * If adjust_size_to_image is true, the host actor will be redimensioned to the size of one +183 * single image from the SpriteImage (either supplied or generated because of passing an Image or +184 * Canvas to the function). That means the size will be set to [width:SpriteImage.singleWidth, +185 * height:singleHeight]. 186 * -187 * @param image {Image|HTMLCanvasElement|CAAT.SpriteImage} -188 * @param adjust_size_to_image {boolean} whether to set this actor's size based on image parameter. -189 * -190 * @return this -191 */ -192 setBackgroundImage : function(image, adjust_size_to_image ) { -193 if ( image ) { -194 if ( !(image instanceof CAAT.SpriteImage) ) { -195 image= new CAAT.SpriteImage().initialize(image,1,1); -196 } -197 -198 image.setOwner(this); -199 this.backgroundImage= image; -200 if ( typeof adjust_size_to_image==='undefined' || adjust_size_to_image ) { -201 this.width= image.getWidth(); -202 this.height= image.getHeight(); -203 } -204 -205 this.glEnabled= true; -206 } else { -207 this.backgroundImage= null; -208 } -209 -210 return this; -211 }, -212 /** -213 * Set the actor's SpriteImage index from animation sheet. -214 * @see CAAT.SpriteImage -215 * @param index {number} -216 * -217 * @return this -218 */ -219 setSpriteIndex: function(index) { -220 if ( this.backgroundImage ) { -221 this.backgroundImage.setSpriteIndex(index); -222 } -223 -224 return this; -225 -226 }, -227 /** -228 * Set this actor's background SpriteImage offset displacement. -229 * The values can be either positive or negative meaning the texture space of this background -230 * image does not start at (0,0) but at the desired position. -231 * @see CAAT.SpriteImage -232 * @param ox {number} horizontal offset -233 * @param oy {number} vertical offset -234 * -235 * @return this -236 */ -237 setBackgroundImageOffset : function( ox, oy ) { -238 if ( this.backgroundImage ) { -239 this.backgroundImage.setOffset(ox,oy); -240 } -241 -242 return this; -243 }, -244 /** -245 * Set this actor's background SpriteImage its animation sequence. -246 * In its simplet's form a SpriteImage treats a given image as an array of rows by columns -247 * subimages. If you define d Sprite Image of 2x2, you'll be able to draw any of the 4 subimages. -248 * This method defines the animation sequence so that it could be set [0,2,1,3,2,1] as the -249 * animation sequence -250 * @param ii {Array<number>} an array of integers. -251 */ -252 setAnimationImageIndex : function( ii ) { -253 if ( this.backgroundImage ) { -254 this.backgroundImage.setAnimationImageIndex(ii); -255 } -256 return this; -257 }, -258 setChangeFPS : function(time) { -259 if ( this.backgroundImage ) { -260 this.backgroundImage.setChangeFPS(time); -261 } -262 return this; -263 -264 }, -265 /** -266 * Set this background image transformation. -267 * If GL is enabled, this parameter has no effect. -268 * @param it any value from CAAT.SpriteImage.TR_* -269 * @return this -270 */ -271 setImageTransformation : function( it ) { -272 if ( this.backgroundImage ) { -273 this.backgroundImage.setSpriteTransformation(it); -274 } -275 return this; -276 }, -277 /** -278 * Center this actor at position (x,y). -279 * @param x {number} x position -280 * @param y {number} y position -281 * -282 * @return this -283 * @deprecated -284 */ -285 centerOn : function( x,y ) { -286 this.setLocation( x-this.width/2, y-this.height/2 ); -287 return this; -288 }, -289 /** -290 * Center this actor at position (x,y). -291 * @param x {number} x position -292 * @param y {number} y position -293 * -294 * @return this -295 */ -296 centerAt : function(x,y) { -297 return this.centerOn(x,y); -298 }, -299 /** -300 * If GL is enables, get this background image's texture page, otherwise it will fail. -301 * @return {CAAT.GLTexturePage} -302 */ -303 getTextureGLPage : function() { -304 return this.backgroundImage.image.__texturePage; -305 }, -306 /** -307 * Set this actor invisible. -308 * The actor is animated but not visible. -309 * A container won't show any of its children if set visible to false. -310 * -311 * @param visible {boolean} set this actor visible or not. -312 * @return this -313 */ -314 setVisible : function(visible) { -315 this.visible= visible; -316 return this; -317 }, -318 /** -319 * Puts an Actor out of time line, that is, won't be transformed nor rendered. -320 * @return this -321 */ -322 setOutOfFrameTime : function() { -323 this.setFrameTime(-1,0); -324 return this; -325 }, -326 /** -327 * Adds an Actor's life cycle listener. -328 * The developer must ensure the actorListener is not already a listener, otherwise -329 * it will notified more than once. -330 * @param actorListener {object} an object with at least a method of the form: -331 * <code>actorLyfeCycleEvent( actor, string_event_type, long_time )</code> -332 */ -333 addListener : function( actorListener ) { -334 this.lifecycleListenerList.push(actorListener); -335 return this; -336 }, -337 /** -338 * Removes an Actor's life cycle listener. -339 * It will only remove the first occurrence of the given actorListener. -340 * @param actorListener {object} an Actor's life cycle listener. -341 */ -342 removeListener : function( actorListener ) { -343 var n= this.lifecycleListenerList.length; -344 while(n--) { -345 if ( this.lifecycleListenerList[n]===actorListener ) { -346 // remove the nth element. -347 this.lifecycleListenerList.splice(n,1); -348 return; -349 } -350 } -351 }, -352 /** -353 * Set alpha composition scope. global will mean this alpha value will be its children maximum. -354 * If set to false, only this actor will have this alpha value. -355 * @param global {boolean} whether the alpha value should be propagated to children. -356 */ -357 setGlobalAlpha : function( global ) { -358 this.isGlobalAlpha= global; -359 return this; -360 }, -361 /** -362 * Notifies the registered Actor's life cycle listener about some event. -363 * @param sEventType an string indicating the type of event being notified. -364 * @param time an integer indicating the time related to Scene's timeline when the event -365 * is being notified. -366 */ -367 fireEvent : function(sEventType, time) { -368 for( var i=0; i<this.lifecycleListenerList.length; i++ ) { -369 this.lifecycleListenerList[i].actorLifeCycleEvent(this, sEventType, time); -370 } -371 }, -372 /** -373 * Calculates the 2D bounding box in canvas coordinates of the Actor. -374 * This bounding box takes into account the transformations applied hierarchically for -375 * each Scene Actor. -376 * -377 * @private -378 * -379 */ -380 setScreenBounds : function() { -381 -382 this.viewVertices[0].set(0, 0); -383 this.viewVertices[1].set(this.width, 0); -384 this.viewVertices[2].set(this.width, this.height); -385 this.viewVertices[3].set(0, this.height); -386 -387 this.modelToView( this.viewVertices ); -388 -389 var xmin= Number.MAX_VALUE, xmax=Number.MIN_VALUE; -390 var ymin= Number.MAX_VALUE, ymax=Number.MIN_VALUE; -391 -392 for( var i=0; i<4; i++ ) { -393 if ( this.viewVertices[i].x < xmin ) { -394 xmin=this.viewVertices[i].x; -395 } -396 if ( this.viewVertices[i].x > xmax ) { -397 xmax=this.viewVertices[i].x; -398 } -399 if ( this.viewVertices[i].y < ymin ) { -400 ymin=this.viewVertices[i].y; -401 } -402 if ( this.viewVertices[i].y > ymax ) { -403 ymax=this.viewVertices[i].y; -404 } -405 } -406 -407 this.AABB.x= xmin; -408 this.AABB.y= ymin; -409 this.AABB.width= (xmax-xmin); -410 this.AABB.height= (ymax-ymin); -411 -412 return this; -413 }, -414 /** -415 * Sets this Actor as Expired. -416 * If this is a Container, all the contained Actors won't be nor drawn nor will receive -417 * any event. That is, expiring an Actor means totally taking it out the Scene's timeline. -418 * @param time {number} an integer indicating the time the Actor was expired at. -419 * @return this. -420 */ -421 setExpired : function(time) { -422 this.expired= true; -423 this.fireEvent('expired',time); -424 return this; -425 }, -426 /** -427 * Enable or disable the event bubbling for this Actor. -428 * @param enable {boolean} a boolean indicating whether the event bubbling is enabled. -429 * @return this -430 */ -431 enableEvents : function( enable ) { -432 this.mouseEnabled= enable; -433 return this; -434 }, -435 /** -436 * Removes all behaviors from an Actor. -437 * @return this -438 * -439 * @deprecated -440 */ -441 emptyBehaviorList : function() { -442 this.behaviorList=[]; -443 return this; -444 }, -445 /* -446 emptyKeyframesList : function() { -447 this.keyframesList= []; -448 }, -449 */ -450 /** -451 * Caches a fillStyle in the Actor. -452 * @param style a valid Canvas rendering context fillStyle. -453 * @return this -454 */ -455 setFillStyle : function( style ) { -456 this.fillStyle= style; -457 return this; -458 }, -459 /** -460 * Caches a stroke style in the Actor. -461 * @param style a valid canvas rendering context stroke style. -462 * @return this -463 */ -464 setStrokeStyle : function( style ) { -465 this.strokeStyle= style; -466 return this; -467 }, -468 /** -469 * @deprecated -470 * @param paint -471 */ -472 setPaint : function( paint ) { -473 return this.setFillStyle(paint); -474 }, -475 /** -476 * Stablishes the Alpha transparency for the Actor. -477 * If it globalAlpha enabled, this alpha will the maximum alpha for every contained actors. -478 * The alpha must be between 0 and 1. -479 * @param alpha a float indicating the alpha value. -480 * @return this -481 */ -482 setAlpha : function( alpha ) { -483 this.alpha= alpha; -484 return this; -485 }, -486 /** -487 * Remove all transformation values for the Actor. -488 * @return this -489 */ -490 resetTransform : function () { -491 this.rotationAngle=0; -492 this.rotateAnchor=0; -493 this.rotationX=.5; -494 this.rotationY=.5; -495 this.scaleX=1; -496 this.scaleY=1; -497 this.scaleTX=.5; -498 this.scaleTY=.5; -499 this.scaleAnchor=0; -500 this.oldX=-1; -501 this.oldY=-1; -502 this.dirty= true; -503 -504 return this; -505 }, -506 /** -507 * Sets the time life cycle for an Actor. -508 * These values are related to Scene time. -509 * @param startTime an integer indicating the time until which the Actor won't be visible on the Scene. -510 * @param duration an integer indicating how much the Actor will last once visible. -511 * @return this -512 */ -513 setFrameTime : function( startTime, duration ) { -514 this.start_time= startTime; -515 this.duration= duration; -516 this.expired= false; -517 this.dirty= true; -518 -519 return this; -520 }, -521 /** -522 * This method should me overriden by every custom Actor. -523 * It will be the drawing routine called by the Director to show every Actor. -524 * @param director the CAAT.Director instance that contains the Scene the Actor is in. -525 * @param time an integer indicating the Scene time in which the drawing is performed. -526 */ -527 paint : function(director, time) { -528 if ( this.backgroundImage ) { -529 this.backgroundImage.paint(director,time,0,0); -530 } else if ( this.fillStyle ) { -531 var ctx= director.crc; -532 ctx.fillStyle= this.fillStyle; -533 ctx.fillRect(0,0,this.width,this.height ); -534 } -535 -536 }, -537 /** -538 * A helper method to setScaleAnchored with an anchor of ANCHOR_CENTER -539 * -540 * @see setScaleAnchored -541 * -542 * @param sx a float indicating a width size multiplier. -543 * @param sy a float indicating a height size multiplier. -544 * @return this -545 */ -546 setScale : function( sx, sy ) { -547 //this.setScaleAnchored( sx, sy, this.width/2, this.height/2 ); -548 this.setScaleAnchored( sx, sy, .5, .5 ); -549 this.dirty= true; -550 return this; -551 }, -552 getAnchorPercent : function( anchor ) { -553 -554 var anchors=[ -555 .50,.50, .50,0, .50,1.00, -556 0,.50, 1.00,.50, 0,0, -557 1.00,0, 0,1.00, 1.00,1.00 -558 ]; -559 -560 return { x: anchors[anchor*2], y: anchors[anchor*2+1] }; -561 }, -562 /** -563 * Private. -564 * Gets a given anchor position referred to the Actor. -565 * @param anchor -566 * @return an object of the form { x: float, y: float } -567 */ -568 getAnchor : function( anchor ) { -569 var tx=0, ty=0; +187 * WARN: if using a CSS renderer, the image supplied MUST be a HTMLImageElement instance. +188 * +189 * @see CAAT.SpriteImage +190 * +191 * @param image {Image|HTMLCanvasElement|CAAT.SpriteImage} +192 * @param adjust_size_to_image {boolean} whether to set this actor's size based on image parameter. +193 * +194 * @return this +195 */ +196 setBackgroundImage : function(image, adjust_size_to_image ) { +197 if ( image ) { +198 if ( !(image instanceof CAAT.SpriteImage) ) { +199 image= new CAAT.SpriteImage().initialize(image,1,1); +200 } +201 +202 image.setOwner(this); +203 this.backgroundImage= image; +204 if ( typeof adjust_size_to_image==='undefined' || adjust_size_to_image ) { +205 this.width= image.getWidth(); +206 this.height= image.getHeight(); +207 } +208 +209 this.glEnabled= true; +210 } else { +211 this.backgroundImage= null; +212 } +213 +214 return this; +215 }, +216 /** +217 * Set the actor's SpriteImage index from animation sheet. +218 * @see CAAT.SpriteImage +219 * @param index {number} +220 * +221 * @return this +222 */ +223 setSpriteIndex: function(index) { +224 if ( this.backgroundImage ) { +225 this.backgroundImage.setSpriteIndex(index); +226 } +227 +228 return this; +229 +230 }, +231 /** +232 * Set this actor's background SpriteImage offset displacement. +233 * The values can be either positive or negative meaning the texture space of this background +234 * image does not start at (0,0) but at the desired position. +235 * @see CAAT.SpriteImage +236 * @param ox {number} horizontal offset +237 * @param oy {number} vertical offset +238 * +239 * @return this +240 */ +241 setBackgroundImageOffset : function( ox, oy ) { +242 if ( this.backgroundImage ) { +243 this.backgroundImage.setOffset(ox,oy); +244 } +245 +246 return this; +247 }, +248 /** +249 * Set this actor's background SpriteImage its animation sequence. +250 * In its simplet's form a SpriteImage treats a given image as an array of rows by columns +251 * subimages. If you define d Sprite Image of 2x2, you'll be able to draw any of the 4 subimages. +252 * This method defines the animation sequence so that it could be set [0,2,1,3,2,1] as the +253 * animation sequence +254 * @param ii {Array<number>} an array of integers. +255 */ +256 setAnimationImageIndex : function( ii ) { +257 if ( this.backgroundImage ) { +258 this.backgroundImage.setAnimationImageIndex(ii); +259 } +260 return this; +261 }, +262 setChangeFPS : function(time) { +263 if ( this.backgroundImage ) { +264 this.backgroundImage.setChangeFPS(time); +265 } +266 return this; +267 +268 }, +269 /** +270 * Set this background image transformation. +271 * If GL is enabled, this parameter has no effect. +272 * @param it any value from CAAT.SpriteImage.TR_* +273 * @return this +274 */ +275 setImageTransformation : function( it ) { +276 if ( this.backgroundImage ) { +277 this.backgroundImage.setSpriteTransformation(it); +278 } +279 return this; +280 }, +281 /** +282 * Center this actor at position (x,y). +283 * @param x {number} x position +284 * @param y {number} y position +285 * +286 * @return this +287 * @deprecated +288 */ +289 centerOn : function( x,y ) { +290 this.setLocation( x-this.width/2, y-this.height/2 ); +291 return this; +292 }, +293 /** +294 * Center this actor at position (x,y). +295 * @param x {number} x position +296 * @param y {number} y position +297 * +298 * @return this +299 */ +300 centerAt : function(x,y) { +301 return this.centerOn(x,y); +302 }, +303 /** +304 * If GL is enables, get this background image's texture page, otherwise it will fail. +305 * @return {CAAT.GLTexturePage} +306 */ +307 getTextureGLPage : function() { +308 return this.backgroundImage.image.__texturePage; +309 }, +310 /** +311 * Set this actor invisible. +312 * The actor is animated but not visible. +313 * A container won't show any of its children if set visible to false. +314 * +315 * @param visible {boolean} set this actor visible or not. +316 * @return this +317 */ +318 setVisible : function(visible) { +319 this.visible= visible; +320 return this; +321 }, +322 /** +323 * Puts an Actor out of time line, that is, won't be transformed nor rendered. +324 * @return this +325 */ +326 setOutOfFrameTime : function() { +327 this.setFrameTime(-1,0); +328 return this; +329 }, +330 /** +331 * Adds an Actor's life cycle listener. +332 * The developer must ensure the actorListener is not already a listener, otherwise +333 * it will notified more than once. +334 * @param actorListener {object} an object with at least a method of the form: +335 * <code>actorLyfeCycleEvent( actor, string_event_type, long_time )</code> +336 */ +337 addListener : function( actorListener ) { +338 this.lifecycleListenerList.push(actorListener); +339 return this; +340 }, +341 /** +342 * Removes an Actor's life cycle listener. +343 * It will only remove the first occurrence of the given actorListener. +344 * @param actorListener {object} an Actor's life cycle listener. +345 */ +346 removeListener : function( actorListener ) { +347 var n= this.lifecycleListenerList.length; +348 while(n--) { +349 if ( this.lifecycleListenerList[n]===actorListener ) { +350 // remove the nth element. +351 this.lifecycleListenerList.splice(n,1); +352 return; +353 } +354 } +355 }, +356 /** +357 * Set alpha composition scope. global will mean this alpha value will be its children maximum. +358 * If set to false, only this actor will have this alpha value. +359 * @param global {boolean} whether the alpha value should be propagated to children. +360 */ +361 setGlobalAlpha : function( global ) { +362 this.isGlobalAlpha= global; +363 return this; +364 }, +365 /** +366 * Notifies the registered Actor's life cycle listener about some event. +367 * @param sEventType an string indicating the type of event being notified. +368 * @param time an integer indicating the time related to Scene's timeline when the event +369 * is being notified. +370 */ +371 fireEvent : function(sEventType, time) { +372 for( var i=0; i<this.lifecycleListenerList.length; i++ ) { +373 this.lifecycleListenerList[i].actorLifeCycleEvent(this, sEventType, time); +374 } +375 }, +376 /** +377 * Sets this Actor as Expired. +378 * If this is a Container, all the contained Actors won't be nor drawn nor will receive +379 * any event. That is, expiring an Actor means totally taking it out the Scene's timeline. +380 * @param time {number} an integer indicating the time the Actor was expired at. +381 * @return this. +382 */ +383 setExpired : function(time) { +384 this.expired= true; +385 this.fireEvent('expired',time); +386 return this; +387 }, +388 /** +389 * Enable or disable the event bubbling for this Actor. +390 * @param enable {boolean} a boolean indicating whether the event bubbling is enabled. +391 * @return this +392 */ +393 enableEvents : function( enable ) { +394 this.mouseEnabled= enable; +395 return this; +396 }, +397 /** +398 * Removes all behaviors from an Actor. +399 * @return this +400 * +401 * @deprecated +402 */ +403 emptyBehaviorList : function() { +404 this.behaviorList=[]; +405 return this; +406 }, +407 /* +408 emptyKeyframesList : function() { +409 this.keyframesList= []; +410 }, +411 */ +412 /** +413 * Caches a fillStyle in the Actor. +414 * @param style a valid Canvas rendering context fillStyle. +415 * @return this +416 */ +417 setFillStyle : function( style ) { +418 this.fillStyle= style; +419 return this; +420 }, +421 /** +422 * Caches a stroke style in the Actor. +423 * @param style a valid canvas rendering context stroke style. +424 * @return this +425 */ +426 setStrokeStyle : function( style ) { +427 this.strokeStyle= style; +428 return this; +429 }, +430 /** +431 * @deprecated +432 * @param paint +433 */ +434 setPaint : function( paint ) { +435 return this.setFillStyle(paint); +436 }, +437 /** +438 * Stablishes the Alpha transparency for the Actor. +439 * If it globalAlpha enabled, this alpha will the maximum alpha for every contained actors. +440 * The alpha must be between 0 and 1. +441 * @param alpha a float indicating the alpha value. +442 * @return this +443 */ +444 setAlpha : function( alpha ) { +445 this.alpha= alpha; +446 return this; +447 }, +448 /** +449 * Remove all transformation values for the Actor. +450 * @return this +451 */ +452 resetTransform : function () { +453 this.rotationAngle=0; +454 this.rotationX=.5; +455 this.rotationY=.5; +456 this.scaleX=1; +457 this.scaleY=1; +458 this.scaleTX=.5; +459 this.scaleTY=.5; +460 this.scaleAnchor=0; +461 this.oldX=-1; +462 this.oldY=-1; +463 this.dirty= true; +464 +465 return this; +466 }, +467 /** +468 * Sets the time life cycle for an Actor. +469 * These values are related to Scene time. +470 * @param startTime an integer indicating the time until which the Actor won't be visible on the Scene. +471 * @param duration an integer indicating how much the Actor will last once visible. +472 * @return this +473 */ +474 setFrameTime : function( startTime, duration ) { +475 this.start_time= startTime; +476 this.duration= duration; +477 this.expired= false; +478 this.dirty= true; +479 +480 return this; +481 }, +482 /** +483 * This method should me overriden by every custom Actor. +484 * It will be the drawing routine called by the Director to show every Actor. +485 * @param director the CAAT.Director instance that contains the Scene the Actor is in. +486 * @param time an integer indicating the Scene time in which the drawing is performed. +487 */ +488 paint : function(director, time) { +489 if ( this.backgroundImage ) { +490 this.backgroundImage.paint(director,time,0,0); +491 } else if ( this.fillStyle ) { +492 var ctx= director.crc; +493 ctx.fillStyle= this.fillStyle; +494 ctx.fillRect(0,0,this.width,this.height ); +495 } +496 +497 }, +498 /** +499 * A helper method to setScaleAnchored with an anchor of ANCHOR_CENTER +500 * +501 * @see setScaleAnchored +502 * +503 * @param sx a float indicating a width size multiplier. +504 * @param sy a float indicating a height size multiplier. +505 * @return this +506 */ +507 setScale : function( sx, sy ) { +508 //this.setScaleAnchored( sx, sy, this.width/2, this.height/2 ); +509 this.setScaleAnchored( sx, sy, .5, .5 ); +510 this.dirty= true; +511 return this; +512 }, +513 getAnchorPercent : function( anchor ) { +514 +515 var anchors=[ +516 .50,.50, .50,0, .50,1.00, +517 0,.50, 1.00,.50, 0,0, +518 1.00,0, 0,1.00, 1.00,1.00 +519 ]; +520 +521 return { x: anchors[anchor*2], y: anchors[anchor*2+1] }; +522 }, +523 /** +524 * Private. +525 * Gets a given anchor position referred to the Actor. +526 * @param anchor +527 * @return an object of the form { x: float, y: float } +528 */ +529 getAnchor : function( anchor ) { +530 var tx=0, ty=0; +531 +532 switch( anchor ) { +533 case this.ANCHOR_CENTER: +534 tx= .5; +535 ty= .5; +536 break; +537 case this.ANCHOR_TOP: +538 tx= .5; +539 ty= 0; +540 break; +541 case this.ANCHOR_BOTTOM: +542 tx= .5; +543 ty= 1; +544 break; +545 case this.ANCHOR_LEFT: +546 tx= 0; +547 ty= .5; +548 break; +549 case this.ANCHOR_RIGHT: +550 tx= 1; +551 ty= .5; +552 break; +553 case this.ANCHOR_TOP_RIGHT: +554 tx= 1; +555 ty= 0; +556 break; +557 case this.ANCHOR_BOTTOM_LEFT: +558 tx= 0; +559 ty= 1; +560 break; +561 case this.ANCHOR_BOTTOM_RIGHT: +562 tx= 1; +563 ty= 1; +564 break; +565 case this.ANCHOR_TOP_LEFT: +566 tx= 0; +567 ty= 0; +568 break; +569 } 570 -571 switch( anchor ) { -572 case this.ANCHOR_CENTER: -573 tx= .5; -574 ty= .5; -575 break; -576 case this.ANCHOR_TOP: -577 tx= .5; -578 ty= 0; -579 break; -580 case this.ANCHOR_BOTTOM: -581 tx= .5; -582 ty= 1; -583 break; -584 case this.ANCHOR_LEFT: -585 tx= 0; -586 ty= .5; -587 break; -588 case this.ANCHOR_RIGHT: -589 tx= 1; -590 ty= .5; -591 break; -592 case this.ANCHOR_TOP_RIGHT: -593 tx= 1; -594 ty= 0; -595 break; -596 case this.ANCHOR_BOTTOM_LEFT: -597 tx= 0; -598 ty= 1; -599 break; -600 case this.ANCHOR_BOTTOM_RIGHT: -601 tx= 1; -602 ty= 1; -603 break; -604 case this.ANCHOR_TOP_LEFT: -605 tx= 0; -606 ty= 0; -607 break; -608 } -609 -610 return {x: tx, y: ty}; -611 }, -612 /** -613 * Modify the dimensions on an Actor. -614 * The dimension will not affect the local coordinates system in opposition -615 * to setSize or setBounds. -616 * -617 * @param sx {number} width scale. -618 * @param sy {number} height scale. -619 * @param anchorx {number} x anchor to perform the Scale operation. -620 * @param anchory {number} y anchor to perform the Scale operation. -621 * -622 * @return this; -623 */ -624 setScaleAnchored : function( sx, sy, anchorx, anchory ) { -625 this.scaleTX= anchorx; -626 this.scaleTY= anchory; -627 -628 this.scaleX=sx; -629 this.scaleY=sy; -630 -631 this.dirty= true; -632 -633 return this; -634 }, -635 /** -636 * A helper method for setRotationAnchored. This methods stablishes the center -637 * of rotation to be the center of the Actor. -638 * -639 * @param angle a float indicating the angle in radians to rotate the Actor. -640 * @return this -641 */ -642 setRotation : function( angle ) { -643 this.setRotationAnchored( angle, .5, .5 ); //this.width/2, this.height/2 ); -644 return this; -645 }, -646 /** -647 * This method sets Actor rotation around a given position. -648 * @param angle {number} indicating the angle in radians to rotate the Actor. -649 * @param rx {number} value in the range 0..1 -650 * @param ry {number} value in the range 0..1 -651 * @return this; -652 */ -653 setRotationAnchored : function( angle, rx, ry ) { -654 this.rotationAngle= angle; -655 this.rotationX= rx?rx:0; -656 this.rotationY= ry?ry:0; -657 this.dirty= true; -658 return this; -659 }, -660 /** -661 * Sets an Actor's dimension -662 * @param w a float indicating Actor's width. -663 * @param h a float indicating Actor's height. +571 return {x: tx, y: ty}; +572 }, +573 /** +574 * Modify the dimensions on an Actor. +575 * The dimension will not affect the local coordinates system in opposition +576 * to setSize or setBounds. +577 * +578 * @param sx {number} width scale. +579 * @param sy {number} height scale. +580 * @param anchorx {number} x anchor to perform the Scale operation. +581 * @param anchory {number} y anchor to perform the Scale operation. +582 * +583 * @return this; +584 */ +585 setScaleAnchored : function( sx, sy, anchorx, anchory ) { +586 this.scaleTX= anchorx; +587 this.scaleTY= anchory; +588 +589 this.scaleX=sx; +590 this.scaleY=sy; +591 +592 this.dirty= true; +593 +594 return this; +595 }, +596 /** +597 * A helper method for setRotationAnchored. This methods stablishes the center +598 * of rotation to be the center of the Actor. +599 * +600 * @param angle a float indicating the angle in radians to rotate the Actor. +601 * @return this +602 */ +603 setRotation : function( angle ) { +604 this.setRotationAnchored( angle, .5, .5 ); //this.width/2, this.height/2 ); +605 return this; +606 }, +607 /** +608 * This method sets Actor rotation around a given position. +609 * @param angle {number} indicating the angle in radians to rotate the Actor. +610 * @param rx {number} value in the range 0..1 +611 * @param ry {number} value in the range 0..1 +612 * @return this; +613 */ +614 setRotationAnchored : function( angle, rx, ry ) { +615 this.rotationAngle= angle; +616 this.rotationX= rx?rx:0; +617 this.rotationY= ry?ry:0; +618 this.dirty= true; +619 return this; +620 }, +621 /** +622 * Sets an Actor's dimension +623 * @param w a float indicating Actor's width. +624 * @param h a float indicating Actor's height. +625 * @return this +626 */ +627 setSize : function( w, h ) { +628 this.width= w|0; +629 this.height= h|0; +630 this.dirty= true; +631 +632 return this; +633 }, +634 /** +635 * Set location and dimension of an Actor at once. +636 * +637 * @param x{number} a float indicating Actor's x position. +638 * @param y{number} a float indicating Actor's y position +639 * @param w{number} a float indicating Actor's width +640 * @param h{number} a float indicating Actor's height +641 * @return this +642 */ +643 setBounds : function(x, y, w, h) { +644 /* +645 this.x= x|0; +646 this.y= y|0; +647 this.width= w|0; +648 this.height= h|0; +649 */ +650 this.x= x; +651 this.y= y; +652 this.width= w; +653 this.height= h; +654 +655 this.dirty= true; +656 +657 return this; +658 }, +659 /** +660 * This method sets the position of an Actor inside its parent. +661 * +662 * @param x{number} a float indicating Actor's x position +663 * @param y{number} a float indicating Actor's y position 664 * @return this 665 */ -666 setSize : function( w, h ) { -667 this.width= w|0; -668 this.height= h|0; -669 this.dirty= true; +666 setLocation : function( x, y ) { +667 /* +668 this.x= x|0; +669 this.y= y|0; 670 -671 return this; -672 }, -673 /** -674 * Set location and dimension of an Actor at once. -675 * -676 * @param x{number} a float indicating Actor's x position. -677 * @param y{number} a float indicating Actor's y position -678 * @param w{number} a float indicating Actor's width -679 * @param h{number} a float indicating Actor's height -680 * @return this -681 */ -682 setBounds : function(x, y, w, h) { -683 /* -684 this.x= x|0; -685 this.y= y|0; -686 this.width= w|0; -687 this.height= h|0; -688 */ -689 this.x= x; -690 this.y= y; -691 this.width= w; -692 this.height= h; -693 -694 this.dirty= true; -695 -696 return this; -697 }, -698 /** -699 * This method sets the position of an Actor inside its parent. -700 * -701 * @param x{number} a float indicating Actor's x position -702 * @param y{number} a float indicating Actor's y position -703 * @return this -704 */ -705 setLocation : function( x, y ) { -706 /* -707 this.x= x|0; -708 this.y= y|0; -709 -710 this.oldX= x|0; -711 this.oldY= y|0; -712 */ -713 this.x= x; -714 this.y= y; -715 this.oldX= x; -716 this.oldY= y; -717 -718 this.dirty= true; -719 -720 return this; -721 }, -722 /** -723 * This method is called by the Director to know whether the actor is on Scene time. -724 * In case it was necessary, this method will notify any life cycle behaviors about -725 * an Actor expiration. -726 * @param time {number} time indicating the Scene time. -727 * -728 * @private -729 * -730 */ -731 isInAnimationFrame : function(time) { -732 if ( this.expired ) { -733 return false; -734 } -735 -736 if ( this.duration===Number.MAX_VALUE ) { -737 return this.start_time<=time; -738 } -739 -740 if ( time>=this.start_time+this.duration ) { -741 if ( !this.expired ) { -742 this.setExpired(time); -743 } -744 -745 return false; -746 } -747 -748 return this.start_time<=time && time<this.start_time+this.duration; -749 }, -750 /** -751 * Checks whether a coordinate is inside the Actor's bounding box. -752 * @param x {number} a float -753 * @param y {number} a float -754 * -755 * @return boolean indicating whether it is inside. -756 */ -757 contains : function(x, y) { -758 return x>=0 && y>=0 && x<this.width && y<this.height; -759 }, -760 /** -761 * This method must be called explicitly by every CAAT Actor. -762 * Making the life cycle explicitly initiated has always been a good idea. -763 * -764 * @return this -765 * @deprecated no longer needed. -766 */ -767 create : function() { -768 return this; -769 }, -770 -771 /** -772 * Add a Behavior to the Actor. -773 * An Actor accepts an undefined number of Behaviors. -774 * -775 * @param behavior {CAAT.Behavior} a CAAT.Behavior instance -776 * @return this -777 * -778 * @deprecated -779 */ -780 addBehavior : function( behavior ) { -781 this.behaviorList.push(behavior); -782 return this; -783 }, -784 -785 /** -786 * Remove a Behavior from the Actor. -787 * If the Behavior is not present at the actor behavior collection nothing happends. -788 * -789 * @param behavior {CAAT.Behavior} a CAAT.Behavior instance. -790 */ -791 removeBehaviour : function( behavior ) { -792 var c= this.behaviorList; -793 var n= c.length-1; -794 while(n) { -795 if ( c[n]===behavior ) { -796 c.splice(n,1); -797 return this; -798 } -799 } -800 return this; -801 }, -802 /** -803 * Remove a Behavior with id param as behavior identifier from this actor. -804 * This function will remove ALL behavior instances with the given id. +671 this.oldX= x|0; +672 this.oldY= y|0; +673 */ +674 this.x= x; +675 this.y= y; +676 this.oldX= x; +677 this.oldY= y; +678 +679 this.dirty= true; +680 +681 return this; +682 }, +683 /** +684 * This method is called by the Director to know whether the actor is on Scene time. +685 * In case it was necessary, this method will notify any life cycle behaviors about +686 * an Actor expiration. +687 * @param time {number} time indicating the Scene time. +688 * +689 * @private +690 * +691 */ +692 isInAnimationFrame : function(time) { +693 if ( this.expired ) { +694 return false; +695 } +696 +697 if ( this.duration===Number.MAX_VALUE ) { +698 return this.start_time<=time; +699 } +700 +701 if ( time>=this.start_time+this.duration ) { +702 if ( !this.expired ) { +703 this.setExpired(time); +704 } +705 +706 return false; +707 } +708 +709 return this.start_time<=time && time<this.start_time+this.duration; +710 }, +711 /** +712 * Checks whether a coordinate is inside the Actor's bounding box. +713 * @param x {number} a float +714 * @param y {number} a float +715 * +716 * @return boolean indicating whether it is inside. +717 */ +718 contains : function(x, y) { +719 return x>=0 && y>=0 && x<this.width && y<this.height; +720 }, +721 /** +722 * This method must be called explicitly by every CAAT Actor. +723 * Making the life cycle explicitly initiated has always been a good idea. +724 * +725 * @return this +726 * @deprecated no longer needed. +727 */ +728 create : function() { +729 return this; +730 }, +731 +732 /** +733 * Add a Behavior to the Actor. +734 * An Actor accepts an undefined number of Behaviors. +735 * +736 * @param behavior {CAAT.Behavior} a CAAT.Behavior instance +737 * @return this +738 * +739 * @deprecated +740 */ +741 addBehavior : function( behavior ) { +742 this.behaviorList.push(behavior); +743 return this; +744 }, +745 +746 /** +747 * Remove a Behavior from the Actor. +748 * If the Behavior is not present at the actor behavior collection nothing happends. +749 * +750 * @param behavior {CAAT.Behavior} a CAAT.Behavior instance. +751 */ +752 removeBehaviour : function( behavior ) { +753 var c= this.behaviorList; +754 var n= c.length-1; +755 while(n) { +756 if ( c[n]===behavior ) { +757 c.splice(n,1); +758 return this; +759 } +760 } +761 return this; +762 }, +763 /** +764 * Remove a Behavior with id param as behavior identifier from this actor. +765 * This function will remove ALL behavior instances with the given id. +766 * +767 * @param id {number} an integer. +768 * return this; +769 */ +770 removeBehaviorById : function( id ) { +771 var c= this.behaviorList; +772 for( var n=0; n<c.length; n++ ) { +773 if ( c[n].id===id) { +774 c.splice(n,1); +775 } +776 } +777 +778 return this; +779 +780 }, +781 getBehavior : function(id) { +782 var c= this.behaviorList; +783 for( var n=0; n<c.length; n++ ) { +784 var cc= c[n]; +785 if ( cc.id===id) { +786 return cc; +787 } +788 } +789 return null; +790 }, +791 /** +792 * Set discardable property. If an actor is discardable, upon expiration will be removed from +793 * scene graph and hence deleted. +794 * @param discardable {boolean} a boolean indicating whether the Actor is discardable. +795 * @return this +796 */ +797 setDiscardable : function( discardable ) { +798 this.discardable= discardable; +799 return this; +800 }, +801 /** +802 * This method will be called internally by CAAT when an Actor is expired, and at the +803 * same time, is flagged as discardable. +804 * It notifies the Actor life cycle listeners about the destruction event. 805 * -806 * @param id {number} an integer. -807 * return this; -808 */ -809 removeBehaviorById : function( id ) { -810 var c= this.behaviorList; -811 for( var n=0; n<c.length; n++ ) { -812 if ( c[n].id===id) { -813 c.splice(n,1); -814 } -815 } -816 -817 return this; -818 -819 }, -820 getBehavior : function(id) { -821 var c= this.behaviorList; -822 for( var n=0; n<c.length; n++ ) { -823 var cc= c[n]; -824 if ( cc.id===id) { -825 return cc; -826 } -827 } -828 return null; -829 }, -830 /** -831 * Set discardable property. If an actor is discardable, upon expiration will be removed from -832 * scene graph and hence deleted. -833 * @param discardable {boolean} a boolean indicating whether the Actor is discardable. -834 * @return this -835 */ -836 setDiscardable : function( discardable ) { -837 this.discardable= discardable; -838 return this; -839 }, -840 /** -841 * This method will be called internally by CAAT when an Actor is expired, and at the -842 * same time, is flagged as discardable. -843 * It notifies the Actor life cycle listeners about the destruction event. -844 * -845 * @param time an integer indicating the time at wich the Actor has been destroyed. -846 * -847 * @private -848 * -849 */ -850 destroy : function(time) { -851 if ( this.parent ) { -852 this.parent.removeChild(this); -853 } -854 -855 this.fireEvent('destroyed',time); -856 }, -857 /** -858 * Transform a point or array of points in model space to view space. -859 * -860 * @param point {CAAT.Point|Array} an object of the form {x : float, y: float} -861 * -862 * @return the source transformed elements. -863 * -864 * @private -865 * -866 */ -867 modelToView : function(point) { -868 if ( point instanceof Array ) { -869 for( var i=0; i<point.length; i++ ) { -870 this.worldModelViewMatrix.transformCoord(point[i]); -871 } -872 } -873 else { -874 this.worldModelViewMatrix.transformCoord(point); -875 } -876 -877 return point; -878 }, -879 /** -880 * Transform a local coordinate point on this Actor's coordinate system into -881 * another point in otherActor's coordinate system. +806 * @param time an integer indicating the time at wich the Actor has been destroyed. +807 * +808 * @private +809 * +810 */ +811 destroy : function(time) { +812 if ( this.parent ) { +813 this.parent.removeChild(this); +814 } +815 +816 this.fireEvent('destroyed',time); +817 }, +818 /** +819 * Transform a point or array of points in model space to view space. +820 * +821 * @param point {CAAT.Point|Array} an object of the form {x : float, y: float} +822 * +823 * @return the source transformed elements. +824 * +825 * @private +826 * +827 */ +828 modelToView : function(point) { +829 +830 var tm= this.worldModelViewMatrix.matrix; +831 +832 if ( point instanceof Array ) { +833 for( var i=0; i<point.length; i++ ) { +834 //this.worldModelViewMatrix.transformCoord(point[i]); +835 var pt= point[i]; +836 var x= pt.x; +837 var y= pt.y; +838 pt.x= x*tm[0] + y*tm[1] + tm[2]; +839 pt.y= x*tm[3] + y*tm[4] + tm[5]; +840 } +841 } +842 else { +843 // this.worldModelViewMatrix.transformCoord(point); +844 var x= point.x; +845 var y= point.y; +846 point.x= x*tm[0] + y*tm[1] + tm[2]; +847 point.y= x*tm[3] + y*tm[4] + tm[5]; +848 } +849 +850 return point; +851 }, +852 /** +853 * Transform a local coordinate point on this Actor's coordinate system into +854 * another point in otherActor's coordinate system. +855 * @param point {CAAT.Point} +856 * @param otherActor {CAAT.Actor} +857 */ +858 modelToModel : function( point, otherActor ) { +859 return otherActor.viewToModel( this.modelToView( point ) ); +860 }, +861 /** +862 * Transform a point from model to view space. +863 * <p> +864 * WARNING: every call to this method calculates +865 * actor's world model view matrix. +866 * +867 * @param point {CAAT.Point} a point in screen space to be transformed to model space. +868 * +869 * @return the source point object +870 * +871 * +872 */ +873 viewToModel : function(point) { +874 this.worldModelViewMatrixI= this.worldModelViewMatrix.getInverse(); +875 this.worldModelViewMatrixI.transformCoord(point); +876 return point; +877 }, +878 /** +879 * Private +880 * This method does the needed point transformations across an Actor hierarchy to devise +881 * whether the parameter point coordinate lies inside the Actor. 882 * @param point {CAAT.Point} -883 * @param otherActor {CAAT.Actor} -884 */ -885 modelToModel : function( point, otherActor ) { -886 return otherActor.viewToModel( this.modelToView( point ) ); -887 }, -888 /** -889 * Transform a point from model to view space. -890 * <p> -891 * WARNING: every call to this method calculates -892 * actor's world model view matrix. -893 * -894 * @param point {CAAT.Point} a point in screen space to be transformed to model space. -895 * -896 * @return the source point object -897 * -898 * -899 */ -900 viewToModel : function(point) { -901 this.worldModelViewMatrixI= this.worldModelViewMatrix.getInverse(); -902 this.worldModelViewMatrixI.transformCoord(point); -903 return point; -904 }, -905 /** -906 * Private -907 * This method does the needed point transformations across an Actor hierarchy to devise -908 * whether the parameter point coordinate lies inside the Actor. -909 * @param point {CAAT.Point} -910 * -911 * @return null if the point is not inside the Actor. The Actor otherwise. -912 */ -913 findActorAtPosition : function(point) { -914 if ( !this.mouseEnabled || !this.isInAnimationFrame(this.time) ) { -915 return null; -916 } +883 * +884 * @return null if the point is not inside the Actor. The Actor otherwise. +885 */ +886 findActorAtPosition : function(point) { +887 if ( !this.mouseEnabled || !this.isInAnimationFrame(this.time) ) { +888 return null; +889 } +890 +891 this.modelViewMatrixI= this.modelViewMatrix.getInverse(); +892 this.modelViewMatrixI.transformCoord(point); +893 return this.contains(point.x, point.y) ? this :null; +894 }, +895 /** +896 * Enables a default dragging routine for the Actor. +897 * This default dragging routine allows to: +898 * <li>scale the Actor by pressing shift+drag +899 * <li>rotate the Actor by pressing control+drag +900 * <li>scale non uniformly by pressing alt+shift+drag +901 * +902 * @return this +903 */ +904 enableDrag : function() { +905 +906 var me= this; +907 +908 this.ax= 0; +909 this.ay= 0; +910 this.mx= 0; +911 this.my= 0; +912 this.asx=1; +913 this.asy=1; +914 this.ara=0; +915 this.screenx=0; +916 this.screeny=0; 917 -918 this.modelViewMatrixI= this.modelViewMatrix.getInverse(); -919 this.modelViewMatrixI.transformCoord(point); -920 return this.contains(point.x, point.y) ? this :null; -921 }, -922 /** -923 * Enables a default dragging routine for the Actor. -924 * This default dragging routine allows to: -925 * <li>scale the Actor by pressing shift+drag -926 * <li>rotate the Actor by pressing control+drag -927 * <li>scale non uniformly by pressing alt+shift+drag -928 * -929 * @return this -930 */ -931 enableDrag : function() { -932 -933 var me= this; -934 -935 this.ax= 0; -936 this.ay= 0; -937 this.mx= 0; -938 this.my= 0; -939 this.asx=1; -940 this.asy=1; -941 this.ara=0; -942 this.screenx=0; -943 this.screeny=0; -944 -945 /** -946 * Mouse enter handler for default drag behavior. -947 * @param mouseEvent {CAAT.MouseEvent} -948 * -949 * @ignore -950 */ -951 this.mouseEnter= function(mouseEvent) { -952 this.__d_ax= -1; -953 this.__d_ay= -1; -954 this.pointed= true; -955 CAAT.setCursor('move'); -956 }; -957 -958 /** -959 * Mouse exit handler for default drag behavior. -960 * @param mouseEvent {CAAT.MouseEvent} -961 * -962 * @ignore -963 */ -964 this.mouseExit = function(mouseEvent) { -965 this.__d_ax = -1; -966 this.__d_ay = -1; -967 this.pointed = false; -968 CAAT.setCursor('default'); -969 }; -970 -971 /** -972 * Mouse move handler for default drag behavior. -973 * @param mouseEvent {CAAT.MouseEvent} -974 * -975 * @ignore -976 */ -977 this.mouseMove = function(mouseEvent) { -978 }; -979 -980 /** -981 * Mouse up handler for default drag behavior. -982 * @param mouseEvent {CAAT.MouseEvent} -983 * -984 * @ignore -985 */ -986 this.mouseUp = function(mouseEvent) { -987 this.__d_ax = -1; -988 this.__d_ay = -1; -989 }; -990 -991 /** -992 * Mouse drag handler for default drag behavior. -993 * @param mouseEvent {CAAT.MouseEvent} -994 * -995 * @ignore -996 */ -997 this.mouseDrag = function(mouseEvent) { -998 -999 var pt; -1000 -1001 pt= this.modelToView( new CAAT.Point(mouseEvent.x, mouseEvent.y ) ); -1002 this.parent.viewToModel( pt ); -1003 -1004 if (this.__d_ax === -1 || this.__d_ay === -1) { -1005 this.__d_ax = pt.x; -1006 this.__d_ay = pt.y; -1007 this.__d_asx = this.scaleX; -1008 this.__d_asy = this.scaleY; -1009 this.__d_ara = this.rotationAngle; -1010 this.__d_screenx = mouseEvent.screenPoint.x; -1011 this.__d_screeny = mouseEvent.screenPoint.y; -1012 } -1013 -1014 if (mouseEvent.isShiftDown()) { -1015 var scx = (mouseEvent.screenPoint.x - this.__d_screenx) / 100; -1016 var scy = (mouseEvent.screenPoint.y - this.__d_screeny) / 100; -1017 if (!mouseEvent.isAltDown()) { -1018 var sc = Math.max(scx, scy); -1019 scx = sc; -1020 scy = sc; -1021 } -1022 this.setScale(scx + this.__d_asx, scy + this.__d_asy); -1023 -1024 } else if (mouseEvent.isControlDown()) { -1025 var vx = mouseEvent.screenPoint.x - this.__d_screenx; -1026 var vy = mouseEvent.screenPoint.y - this.__d_screeny; -1027 this.setRotation(-Math.atan2(vx, vy) + this.__d_ara); -1028 } else { -1029 this.x += pt.x-this.__d_ax; -1030 this.y += pt.y-this.__d_ay; -1031 } -1032 -1033 this.__d_ax= pt.x; -1034 this.__d_ay= pt.y; -1035 }; -1036 -1037 return this; -1038 }, -1039 /** -1040 * Default mouseClick handler. -1041 * Mouse click events are received after a call to mouseUp method if no dragging was in progress. -1042 * -1043 * @param mouseEvent {CAAT.MouseEvent} -1044 */ -1045 mouseClick : function(mouseEvent) { -1046 }, -1047 /** -1048 * Default double click handler -1049 * -1050 * @param mouseEvent {CAAT.MouseEvent} -1051 */ -1052 mouseDblClick : function(mouseEvent) { -1053 }, -1054 /** -1055 * Default mouse enter on Actor handler. -1056 * @param mouseEvent {CAAT.MouseEvent} -1057 */ -1058 mouseEnter : function(mouseEvent) { -1059 this.pointed= true; -1060 }, -1061 /** -1062 * Default mouse exit on Actor handler. -1063 * -1064 * @param mouseEvent {CAAT.MouseEvent} -1065 */ -1066 mouseExit : function(mouseEvent) { -1067 this.pointed= false; -1068 }, -1069 /** -1070 * Default mouse move inside Actor handler. -1071 * -1072 * @param mouseEvent {CAAT.MouseEvent} -1073 */ -1074 mouseMove : function(mouseEvent) { -1075 }, -1076 /** -1077 * default mouse press in Actor handler. -1078 * -1079 * @param mouseEvent {CAAT.MouseEvent} +918 /** +919 * Mouse enter handler for default drag behavior. +920 * @param mouseEvent {CAAT.MouseEvent} +921 * +922 * @ignore +923 */ +924 this.mouseEnter= function(mouseEvent) { +925 this.__d_ax= -1; +926 this.__d_ay= -1; +927 this.pointed= true; +928 CAAT.setCursor('move'); +929 }; +930 +931 /** +932 * Mouse exit handler for default drag behavior. +933 * @param mouseEvent {CAAT.MouseEvent} +934 * +935 * @ignore +936 */ +937 this.mouseExit = function(mouseEvent) { +938 this.__d_ax = -1; +939 this.__d_ay = -1; +940 this.pointed = false; +941 CAAT.setCursor('default'); +942 }; +943 +944 /** +945 * Mouse move handler for default drag behavior. +946 * @param mouseEvent {CAAT.MouseEvent} +947 * +948 * @ignore +949 */ +950 this.mouseMove = function(mouseEvent) { +951 }; +952 +953 /** +954 * Mouse up handler for default drag behavior. +955 * @param mouseEvent {CAAT.MouseEvent} +956 * +957 * @ignore +958 */ +959 this.mouseUp = function(mouseEvent) { +960 this.__d_ax = -1; +961 this.__d_ay = -1; +962 }; +963 +964 /** +965 * Mouse drag handler for default drag behavior. +966 * @param mouseEvent {CAAT.MouseEvent} +967 * +968 * @ignore +969 */ +970 this.mouseDrag = function(mouseEvent) { +971 +972 var pt; +973 +974 pt= this.modelToView( new CAAT.Point(mouseEvent.x, mouseEvent.y ) ); +975 this.parent.viewToModel( pt ); +976 +977 if (this.__d_ax === -1 || this.__d_ay === -1) { +978 this.__d_ax = pt.x; +979 this.__d_ay = pt.y; +980 this.__d_asx = this.scaleX; +981 this.__d_asy = this.scaleY; +982 this.__d_ara = this.rotationAngle; +983 this.__d_screenx = mouseEvent.screenPoint.x; +984 this.__d_screeny = mouseEvent.screenPoint.y; +985 } +986 +987 if (mouseEvent.isShiftDown()) { +988 var scx = (mouseEvent.screenPoint.x - this.__d_screenx) / 100; +989 var scy = (mouseEvent.screenPoint.y - this.__d_screeny) / 100; +990 if (!mouseEvent.isAltDown()) { +991 var sc = Math.max(scx, scy); +992 scx = sc; +993 scy = sc; +994 } +995 this.setScale(scx + this.__d_asx, scy + this.__d_asy); +996 +997 } else if (mouseEvent.isControlDown()) { +998 var vx = mouseEvent.screenPoint.x - this.__d_screenx; +999 var vy = mouseEvent.screenPoint.y - this.__d_screeny; +1000 this.setRotation(-Math.atan2(vx, vy) + this.__d_ara); +1001 } else { +1002 this.x += pt.x-this.__d_ax; +1003 this.y += pt.y-this.__d_ay; +1004 } +1005 +1006 this.__d_ax= pt.x; +1007 this.__d_ay= pt.y; +1008 }; +1009 +1010 return this; +1011 }, +1012 /** +1013 * Default mouseClick handler. +1014 * Mouse click events are received after a call to mouseUp method if no dragging was in progress. +1015 * +1016 * @param mouseEvent {CAAT.MouseEvent} +1017 */ +1018 mouseClick : function(mouseEvent) { +1019 }, +1020 /** +1021 * Default double click handler +1022 * +1023 * @param mouseEvent {CAAT.MouseEvent} +1024 */ +1025 mouseDblClick : function(mouseEvent) { +1026 }, +1027 /** +1028 * Default mouse enter on Actor handler. +1029 * @param mouseEvent {CAAT.MouseEvent} +1030 */ +1031 mouseEnter : function(mouseEvent) { +1032 this.pointed= true; +1033 }, +1034 /** +1035 * Default mouse exit on Actor handler. +1036 * +1037 * @param mouseEvent {CAAT.MouseEvent} +1038 */ +1039 mouseExit : function(mouseEvent) { +1040 this.pointed= false; +1041 }, +1042 /** +1043 * Default mouse move inside Actor handler. +1044 * +1045 * @param mouseEvent {CAAT.MouseEvent} +1046 */ +1047 mouseMove : function(mouseEvent) { +1048 }, +1049 /** +1050 * default mouse press in Actor handler. +1051 * +1052 * @param mouseEvent {CAAT.MouseEvent} +1053 */ +1054 mouseDown : function(mouseEvent) { +1055 }, +1056 /** +1057 * default mouse release in Actor handler. +1058 * +1059 * @param mouseEvent {CAAT.MouseEvent} +1060 */ +1061 mouseUp : function(mouseEvent) { +1062 }, +1063 mouseOut : function(mouseEvent) { +1064 }, +1065 mouseOver : function(mouseEvent) { +1066 }, +1067 /** +1068 * default Actor mouse drag handler. +1069 * +1070 * @param mouseEvent {CAAT.MouseEvent} +1071 */ +1072 mouseDrag : function(mouseEvent) { +1073 }, +1074 /** +1075 * Draw a bounding box with on-screen coordinates regardless of the transformations +1076 * applied to the Actor. +1077 * +1078 * @param director {CAAT.Director} object instance that contains the Scene the Actor is in. +1079 * @param time {number} integer indicating the Scene time when the bounding box is to be drawn. 1080 */ -1081 mouseDown : function(mouseEvent) { -1082 }, -1083 /** -1084 * default mouse release in Actor handler. -1085 * -1086 * @param mouseEvent {CAAT.MouseEvent} -1087 */ -1088 mouseUp : function(mouseEvent) { -1089 }, -1090 mouseOut : function(mouseEvent) { -1091 }, -1092 mouseOver : function(mouseEvent) { -1093 }, -1094 /** -1095 * default Actor mouse drag handler. -1096 * -1097 * @param mouseEvent {CAAT.MouseEvent} -1098 */ -1099 mouseDrag : function(mouseEvent) { -1100 }, -1101 /** -1102 * Draw a bounding box with on-screen coordinates regardless of the transformations -1103 * applied to the Actor. +1081 drawScreenBoundingBox : function( director, time ) { +1082 if ( null!==this.AABB && this.inFrame ) { +1083 var s= this.AABB; +1084 var ctx= director.ctx; +1085 ctx.strokeStyle= CAAT.DEBUGAABBCOLOR; +1086 ctx.strokeRect( .5+(s.x|0), .5+(s.y|0), s.width|0, s.height|0 ); +1087 if ( CAAT.DEBUGBB ) { +1088 var vv= this.viewVertices; +1089 ctx.beginPath( ); +1090 ctx.lineTo( vv[0].x, vv[0].y ); +1091 ctx.lineTo( vv[1].x, vv[1].y ); +1092 ctx.lineTo( vv[2].x, vv[2].y ); +1093 ctx.lineTo( vv[3].x, vv[3].y ); +1094 ctx.closePath(); +1095 ctx.strokeStyle= CAAT.DEBUGBBCOLOR; +1096 ctx.stroke(); +1097 } +1098 } +1099 }, +1100 /** +1101 * Private +1102 * This method is called by the Director instance. +1103 * It applies the list of behaviors the Actor has registered. 1104 * -1105 * @param director {CAAT.Director} object instance that contains the Scene the Actor is in. -1106 * @param time {number} integer indicating the Scene time when the bounding box is to be drawn. +1105 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. +1106 * @param time an integer indicating the Scene time when the bounding box is to be drawn. 1107 */ -1108 drawScreenBoundingBox : function( director, time ) { -1109 if ( null!==this.AABB && this.inFrame ) { -1110 var s= this.AABB; -1111 var ctx= director.ctx; -1112 ctx.strokeStyle= CAAT.DEBUGAABBCOLOR; -1113 ctx.strokeRect( .5+(s.x|0), .5+(s.y|0), s.width|0, s.height|0 ); -1114 if ( CAAT.DEBUGBB ) { -1115 var vv= this.viewVertices; -1116 ctx.beginPath( ); -1117 ctx.lineTo( vv[0].x, vv[0].y ); -1118 ctx.lineTo( vv[1].x, vv[1].y ); -1119 ctx.lineTo( vv[2].x, vv[2].y ); -1120 ctx.lineTo( vv[3].x, vv[3].y ); -1121 ctx.closePath(); -1122 ctx.strokeStyle= CAAT.DEBUGBBCOLOR; -1123 ctx.stroke(); -1124 } -1125 } -1126 }, -1127 /** -1128 * Private -1129 * This method is called by the Director instance. -1130 * It applies the list of behaviors the Actor has registered. -1131 * -1132 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. -1133 * @param time an integer indicating the Scene time when the bounding box is to be drawn. -1134 */ -1135 animate : function(director, time) { +1108 animate : function(director, time) { +1109 +1110 var i; +1111 +1112 if ( !this.isInAnimationFrame(time) ) { +1113 this.inFrame= false; +1114 this.dirty= true; +1115 return false; +1116 } +1117 +1118 if ( this.x!==this.oldX || this.y!==this.oldY ) { +1119 this.dirty= true; +1120 this.oldX= this.x; +1121 this.oldY= this.y; +1122 } +1123 +1124 for( i=0; i<this.behaviorList.length; i++ ) { +1125 this.behaviorList[i].apply(time,this); +1126 } +1127 +1128 if ( this.clipPath ) { +1129 this.clipPath.applyBehaviors(time); +1130 } +1131 +1132 // transformation stuff. +1133 this.setModelViewMatrix(director); +1134 +1135 this.inFrame= true; 1136 -1137 var i; -1138 -1139 if ( !this.isInAnimationFrame(time) ) { -1140 this.inFrame= false; -1141 this.dirty= true; -1142 return false; -1143 } -1144 -1145 if ( this.x!==this.oldX || this.y!==this.oldY ) { -1146 this.dirty= true; -1147 this.oldX= this.x; -1148 this.oldY= this.y; -1149 } -1150 -1151 /** -1152 * better avoid using behaviors -1153 * @deprecated -1154 */ -1155 for( i=0; i<this.behaviorList.length; i++ ) { -1156 this.behaviorList[i].apply(time,this); -1157 } -1158 -1159 /* -1160 If we have a mask applied, apply behaviors as well. -1161 */ -1162 if ( this.clipPath ) { -1163 // if ( this.clipPath.applyBehaviors ) { -1164 this.clipPath.applyBehaviors(time); -1165 // } -1166 } +1137 return true; +1138 }, +1139 /** +1140 * Set this model view matrix if the actor is Dirty. +1141 * +1142 mm[2]+= this.x; +1143 mm[5]+= this.y; +1144 if ( this.rotationAngle ) { +1145 this.modelViewMatrix.multiply( m.setTranslate( this.rotationX, this.rotationY) ); +1146 this.modelViewMatrix.multiply( m.setRotation( this.rotationAngle ) ); +1147 this.modelViewMatrix.multiply( m.setTranslate( -this.rotationX, -this.rotationY) ); c= Math.cos( this.rotationAngle ); +1148 } +1149 if ( this.scaleX!=1 || this.scaleY!=1 && (this.scaleTX || this.scaleTY )) { +1150 this.modelViewMatrix.multiply( m.setTranslate( this.scaleTX , this.scaleTY ) ); +1151 this.modelViewMatrix.multiply( m.setScale( this.scaleX, this.scaleY ) ); +1152 this.modelViewMatrix.multiply( m.setTranslate( -this.scaleTX , -this.scaleTY ) ); +1153 } +1154 * +1155 * @return this +1156 */ +1157 setModelViewMatrix : function(director) { +1158 var c,s,_m00,_m01,_m10,_m11; +1159 var mm0, mm1, mm2, mm3, mm4, mm5; +1160 var mm; +1161 +1162 this.wdirty= false; +1163 +1164 if ( this.dirty ) { +1165 +1166 mm= this.modelViewMatrix.matrix; 1167 -1168 // transformation stuff. -1169 this.setModelViewMatrix(director.glEnabled); -1170 -1171 this.inFrame= true; -1172 -1173 return true; -1174 }, -1175 /** -1176 * Set this model view matrix if the actor is Dirty. -1177 * -1178 * @return this -1179 */ -1180 setModelViewMatrix : function(glEnabled) { -1181 var c,s,_m00,_m01,_m10,_m11; -1182 var mm0, mm1, mm2, mm3, mm4, mm5; -1183 var mm; -1184 -1185 this.wdirty= false; -1186 -1187 if ( this.dirty ) { -1188 -1189 mm= this.modelViewMatrix.matrix; -1190 -1191 mm0= 1; -1192 mm1= 0; -1193 mm2= mm[2]; -1194 mm3= 0; -1195 mm4= 1; -1196 mm5= mm[5]; -1197 -1198 mm2= this.x; -1199 mm5= this.y; -1200 -1201 if ( this.rotationAngle ) { -1202 -1203 var rx= this.rotationX*this.width; -1204 var ry= this.rotationY*this.height; -1205 -1206 mm2+= mm0*rx + mm1*ry; -1207 mm5+= mm3*rx + mm4*ry; -1208 -1209 c= Math.cos( this.rotationAngle ); -1210 s= Math.sin( this.rotationAngle ); -1211 _m00= mm0; -1212 _m01= mm1; -1213 _m10= mm3; -1214 _m11= mm4; -1215 mm0= _m00*c + _m01*s; -1216 mm1= -_m00*s + _m01*c; -1217 mm3= _m10*c + _m11*s; -1218 mm4= -_m10*s + _m11*c; -1219 -1220 mm2+= -mm0*rx - mm1*ry; -1221 mm5+= -mm3*rx - mm4*ry; -1222 } -1223 if ( this.scaleX!=1 || this.scaleY!=1 ) { +1168 mm0= 1; +1169 mm1= 0; +1170 mm2= mm[2]; +1171 mm3= 0; +1172 mm4= 1; +1173 mm5= mm[5]; +1174 +1175 mm2= this.x; +1176 mm5= this.y; +1177 +1178 if ( this.rotationAngle ) { +1179 +1180 var rx= this.rotationX*this.width; +1181 var ry= this.rotationY*this.height; +1182 +1183 mm2+= mm0*rx + mm1*ry; +1184 mm5+= mm3*rx + mm4*ry; +1185 +1186 c= Math.cos( this.rotationAngle ); +1187 s= Math.sin( this.rotationAngle ); +1188 _m00= mm0; +1189 _m01= mm1; +1190 _m10= mm3; +1191 _m11= mm4; +1192 mm0= _m00*c + _m01*s; +1193 mm1= -_m00*s + _m01*c; +1194 mm3= _m10*c + _m11*s; +1195 mm4= -_m10*s + _m11*c; +1196 +1197 mm2+= -mm0*rx - mm1*ry; +1198 mm5+= -mm3*rx - mm4*ry; +1199 } +1200 if ( this.scaleX!=1 || this.scaleY!=1 ) { +1201 +1202 var sx= this.scaleTX*this.width; +1203 var sy= this.scaleTY*this.height; +1204 +1205 mm2+= mm0*sx + mm1*sy; +1206 mm5+= mm3*sx + mm4*sy; +1207 +1208 mm0= mm0*this.scaleX; +1209 mm1= mm1*this.scaleY; +1210 mm3= mm3*this.scaleX; +1211 mm4= mm4*this.scaleY; +1212 +1213 mm2+= -mm0*sx - mm1*sy; +1214 mm5+= -mm3*sx - mm4*sy; +1215 } +1216 +1217 mm[0]= mm0; +1218 mm[1]= mm1; +1219 mm[2]= mm2; +1220 mm[3]= mm3; +1221 mm[4]= mm4; +1222 mm[5]= mm5; +1223 } 1224 -1225 var sx= this.scaleTX*this.width; -1226 var sy= this.scaleTY*this.height; -1227 -1228 mm2+= mm0*sx + mm1*sy; -1229 mm5+= mm3*sx + mm4*sy; -1230 -1231 mm0= mm0*this.scaleX; -1232 mm1= mm1*this.scaleY; -1233 mm3= mm3*this.scaleX; -1234 mm4= mm4*this.scaleY; +1225 if ( this.parent ) { +1226 if ( this.dirty || this.parent.wdirty ) { +1227 this.worldModelViewMatrix.copy( this.parent.worldModelViewMatrix ); +1228 this.worldModelViewMatrix.multiply( this.modelViewMatrix ); +1229 this.wdirty= true; +1230 } +1231 } else { +1232 if ( this.dirty ) { +1233 this.wdirty= true; +1234 } 1235 -1236 mm2+= -mm0*sx - mm1*sy; -1237 mm5+= -mm3*sx - mm4*sy; -1238 } -1239 -1240 mm[0]= mm0; -1241 mm[1]= mm1; -1242 mm[2]= mm2; -1243 mm[3]= mm3; -1244 mm[4]= mm4; -1245 mm[5]= mm5; -1246 -1247 /* -1248 mm[2]+= this.x; -1249 mm[5]+= this.y; -1250 if ( this.rotationAngle ) { -1251 // this.modelViewMatrix.multiply( m.setTranslate( this.rotationX, this.rotationY) ); -1252 // this.modelViewMatrix.multiply( m.setRotation( this.rotationAngle ) ); -1253 // this.modelViewMatrix.multiply( m.setTranslate( -this.rotationX, -this.rotationY) ); c= Math.cos( this.rotationAngle ); -1254 } -1255 if ( this.scaleX!=1 || this.scaleY!=1 && (this.scaleTX || this.scaleTY )) { -1256 // this.modelViewMatrix.multiply( m.setTranslate( this.scaleTX , this.scaleTY ) ); -1257 // this.modelViewMatrix.multiply( m.setScale( this.scaleX, this.scaleY ) ); -1258 // this.modelViewMatrix.multiply( m.setTranslate( -this.scaleTX , -this.scaleTY ) ); -1259 -1260 } -1261 */ -1262 } -1263 +1236 this.worldModelViewMatrix.identity(); +1237 } +1238 +1239 //if ( (CAAT.DEBUGAABB || glEnabled) && (this.dirty || this.wdirty ) ) { +1240 // screen bounding boxes will always be calculated. +1241 if ( this.dirty || this.wdirty || this.invalid ) { +1242 if ( director.dirtyRectsEnabled ) { +1243 director.addDirtyRect( this.AABB ); +1244 } +1245 this.setScreenBounds(); +1246 if ( director.dirtyRectsEnabled ) { +1247 director.addDirtyRect( this.AABB ); +1248 } +1249 } +1250 this.dirty= false; +1251 this.invalid= false; +1252 +1253 return this; +1254 }, +1255 /** +1256 * Calculates the 2D bounding box in canvas coordinates of the Actor. +1257 * This bounding box takes into account the transformations applied hierarchically for +1258 * each Scene Actor. +1259 * +1260 * @private +1261 * +1262 */ +1263 setScreenBounds : function() { 1264 -1265 if ( this.parent ) { -1266 if ( this.dirty || this.parent.wdirty ) { -1267 this.worldModelViewMatrix.copy( this.parent.worldModelViewMatrix ); -1268 this.worldModelViewMatrix.multiply( this.modelViewMatrix ); -1269 this.wdirty= true; -1270 } -1271 } else { -1272 if ( this.dirty ) { -1273 this.wdirty= true; -1274 } -1275 //this.worldModelViewMatrix.copy( this.modelViewMatrix ); -1276 this.worldModelViewMatrix.identity(); -1277 } -1278 -1279 if ( (CAAT.DEBUGAABB || glEnabled) && (this.dirty || this.wdirty) ) { -1280 this.setScreenBounds(); -1281 } -1282 this.dirty= false; -1283 -1284 -1285 return this; -1286 }, -1287 /** -1288 * @private. -1289 * This method will be called by the Director to set the whole Actor pre-render process. -1290 * -1291 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. -1292 * @param time an integer indicating the Scene time when the bounding box is to be drawn. -1293 * -1294 * @return boolean indicating whether the Actor isInFrameTime -1295 */ -1296 paintActor : function(director, time) { -1297 -1298 if (!this.visible) { -1299 return true; -1300 } -1301 -1302 var ctx= director.ctx; -1303 -1304 this.frameAlpha= this.parent ? this.parent.frameAlpha*this.alpha : 1; -1305 ctx.globalAlpha= this.frameAlpha; -1306 -1307 this.worldModelViewMatrix.transformRenderingContext(ctx); -1308 -1309 if ( this.clip ) { -1310 ctx.beginPath(); -1311 if (!this.clipPath ) { -1312 ctx.rect(0,0,this.width,this.height); -1313 } else { -1314 this.clipPath.applyAsPath(director); -1315 } -1316 ctx.clip(); -1317 } +1265 var vv= this.viewVertices; +1266 +1267 vv[0].set(0, 0); +1268 vv[1].set(this.width, 0); +1269 vv[2].set(this.width, this.height); +1270 vv[3].set(0, this.height); +1271 +1272 this.modelToView( this.viewVertices ); +1273 +1274 var xmin= Number.MAX_VALUE, xmax=Number.MIN_VALUE; +1275 var ymin= Number.MAX_VALUE, ymax=Number.MIN_VALUE; +1276 +1277 for( var i=0; i<4; i++ ) { +1278 if ( vv[i].x < xmin ) { +1279 xmin=vv[i].x; +1280 } +1281 if ( vv[i].x > xmax ) { +1282 xmax=vv[i].x; +1283 } +1284 if ( vv[i].y < ymin ) { +1285 ymin=vv[i].y; +1286 } +1287 if ( vv[i].y > ymax ) { +1288 ymax=vv[i].y; +1289 } +1290 } +1291 +1292 var AABB= this.AABB; +1293 AABB.x= xmin; +1294 AABB.y= ymin; +1295 AABB.x1= xmax; +1296 AABB.y1= ymax; +1297 AABB.width= (xmax-xmin); +1298 AABB.height= (ymax-ymin); +1299 +1300 return this; +1301 }, +1302 /** +1303 * @private. +1304 * This method will be called by the Director to set the whole Actor pre-render process. +1305 * +1306 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. +1307 * @param time an integer indicating the Scene time when the bounding box is to be drawn. +1308 * +1309 * @return boolean indicating whether the Actor isInFrameTime +1310 */ +1311 paintActor : function(director, time) { +1312 +1313 if (!this.visible) { +1314 return true; +1315 } +1316 +1317 var ctx= director.ctx; 1318 -1319 this.paint(director, time); -1320 -1321 return true; -1322 }, -1323 /** -1324 * for js2native -1325 * @param director -1326 * @param time -1327 */ -1328 __paintActor : function(director, time) { -1329 if (!this.visible) { -1330 return true; -1331 } -1332 var ctx= director.ctx; -1333 -1334 // global opt: set alpha as owns alpha, not take globalAlpha procedure. -1335 this.frameAlpha= this.alpha; +1319 this.frameAlpha= this.parent ? this.parent.frameAlpha*this.alpha : 1; +1320 ctx.globalAlpha= this.frameAlpha; +1321 +1322 director.modelViewMatrix.transformRenderingContextSet( ctx ); +1323 ctx.save(); +1324 +1325 this.worldModelViewMatrix.transformRenderingContext(ctx); +1326 +1327 if ( this.clip ) { +1328 ctx.beginPath(); +1329 if (!this.clipPath ) { +1330 ctx.rect(0,0,this.width,this.height); +1331 } else { +1332 this.clipPath.applyAsPath(director); +1333 } +1334 ctx.clip(); +1335 } 1336 -1337 var m= this.worldModelViewMatrix.matrix; -1338 ctx.setTransform( m[0], m[3], m[1], m[4], m[2], m[5], this.frameAlpha ); -1339 this.paint(director, time); -1340 return true; -1341 }, -1342 +1337 this.paint(director, time); +1338 +1339 ctx.restore(); +1340 +1341 return true; +1342 }, 1343 /** -1344 * Set coordinates and uv values for this actor. -1345 * This function uses Director's coords and indexCoords values. -1346 * @param director -1347 * @param time -1348 */ -1349 paintActorGL : function(director,time) { -1350 -1351 this.frameAlpha= this.parent.frameAlpha*this.alpha; -1352 -1353 if ( !this.glEnabled || !this.visible) { -1354 return; -1355 } +1344 * for js2native +1345 * @param director +1346 * @param time +1347 */ +1348 __paintActor : function(director, time) { +1349 if (!this.visible) { +1350 return true; +1351 } +1352 var ctx= director.ctx; +1353 +1354 // global opt: set alpha as owns alpha, not take globalAlpha procedure. +1355 this.frameAlpha= this.alpha; 1356 -1357 if ( this.glNeedsFlush(director) ) { -1358 director.glFlush(); -1359 this.glSetShader(director); -1360 -1361 if ( !this.__uv ) { -1362 this.__uv= new Float32Array(8); -1363 } -1364 if ( !this.__vv ) { -1365 this.__vv= new Float32Array(12); -1366 } -1367 -1368 this.setGLCoords( this.__vv, 0 ); -1369 this.setUV( this.__uv, 0 ); -1370 director.glRender(this.__vv, 12, this.__uv); -1371 -1372 return; -1373 } -1374 -1375 var glCoords= director.coords; -1376 var glCoordsIndex= director.coordsIndex; -1377 -1378 ////////////////// XYZ -1379 this.setGLCoords(glCoords, glCoordsIndex); -1380 director.coordsIndex= glCoordsIndex+12; -1381 -1382 ////////////////// UV -1383 this.setUV( director.uv, director.uvIndex ); -1384 director.uvIndex+= 8; -1385 }, -1386 /** -1387 * TODO: set GLcoords for different image transformations. -1388 * @param glCoords -1389 * @param glCoordsIndex -1390 * @param z -1391 */ -1392 setGLCoords : function( glCoords, glCoordsIndex ) { -1393 -1394 var vv= this.viewVertices; -1395 glCoords[glCoordsIndex++]= vv[0].x; -1396 glCoords[glCoordsIndex++]= vv[0].y; -1397 glCoords[glCoordsIndex++]= 0; -1398 -1399 glCoords[glCoordsIndex++]= vv[1].x; -1400 glCoords[glCoordsIndex++]= vv[1].y; -1401 glCoords[glCoordsIndex++]= 0; -1402 -1403 glCoords[glCoordsIndex++]= vv[2].x; -1404 glCoords[glCoordsIndex++]= vv[2].y; -1405 glCoords[glCoordsIndex++]= 0; -1406 -1407 glCoords[glCoordsIndex++]= vv[3].x; -1408 glCoords[glCoordsIndex++]= vv[3].y; -1409 glCoords[glCoordsIndex++]= 0; -1410 -1411 }, -1412 /** -1413 * Set UV for this actor's quad. -1414 * -1415 * @param uvBuffer {Float32Array} -1416 * @param uvIndex {number} -1417 */ -1418 setUV : function( uvBuffer, uvIndex ) { -1419 this.backgroundImage.setUV(uvBuffer, uvIndex); -1420 }, -1421 /** -1422 * Test for compulsory gl flushing: -1423 * 1.- opacity has changed. -1424 * 2.- texture page has changed. -1425 * -1426 */ -1427 glNeedsFlush : function(director) { -1428 if ( this.getTextureGLPage()!==director.currentTexturePage ) { -1429 return true; -1430 } -1431 if ( this.frameAlpha!==director.currentOpacity ) { -1432 return true; -1433 } -1434 return false; -1435 }, -1436 /** -1437 * Change texture shader program parameters. -1438 * @param director -1439 */ -1440 glSetShader : function(director) { -1441 -1442 var tp= this.getTextureGLPage(); -1443 if ( tp!==director.currentTexturePage ) { -1444 director.setGLTexturePage(tp); -1445 } -1446 -1447 if ( this.frameAlpha!==director.currentOpacity ) { -1448 director.setGLCurrentOpacity(this.frameAlpha); -1449 } -1450 }, -1451 /** -1452 * @private. -1453 * This method is called after the Director has transformed and drawn a whole frame. -1454 * -1455 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. -1456 * @param time an integer indicating the Scene time when the bounding box is to be drawn. -1457 * @return this -1458 * -1459 * @deprecated -1460 */ -1461 endAnimate : function(director,time) { -1462 return this; -1463 }, -1464 initialize : function(overrides) { -1465 if (overrides) { -1466 for (var i in overrides) { -1467 this[i] = overrides[i]; -1468 } +1357 var m= this.worldModelViewMatrix.matrix; +1358 ctx.setTransform( m[0], m[3], m[1], m[4], m[2], m[5], this.frameAlpha ); +1359 this.paint(director, time); +1360 return true; +1361 }, +1362 +1363 /** +1364 * Set coordinates and uv values for this actor. +1365 * This function uses Director's coords and indexCoords values. +1366 * @param director +1367 * @param time +1368 */ +1369 paintActorGL : function(director,time) { +1370 +1371 this.frameAlpha= this.parent.frameAlpha*this.alpha; +1372 +1373 if ( !this.glEnabled || !this.visible) { +1374 return; +1375 } +1376 +1377 if ( this.glNeedsFlush(director) ) { +1378 director.glFlush(); +1379 this.glSetShader(director); +1380 +1381 if ( !this.__uv ) { +1382 this.__uv= new Float32Array(8); +1383 } +1384 if ( !this.__vv ) { +1385 this.__vv= new Float32Array(12); +1386 } +1387 +1388 this.setGLCoords( this.__vv, 0 ); +1389 this.setUV( this.__uv, 0 ); +1390 director.glRender(this.__vv, 12, this.__uv); +1391 +1392 return; +1393 } +1394 +1395 var glCoords= director.coords; +1396 var glCoordsIndex= director.coordsIndex; +1397 +1398 ////////////////// XYZ +1399 this.setGLCoords(glCoords, glCoordsIndex); +1400 director.coordsIndex= glCoordsIndex+12; +1401 +1402 ////////////////// UV +1403 this.setUV( director.uv, director.uvIndex ); +1404 director.uvIndex+= 8; +1405 }, +1406 /** +1407 * TODO: set GLcoords for different image transformations. +1408 * @param glCoords +1409 * @param glCoordsIndex +1410 * @param z +1411 */ +1412 setGLCoords : function( glCoords, glCoordsIndex ) { +1413 +1414 var vv= this.viewVertices; +1415 glCoords[glCoordsIndex++]= vv[0].x; +1416 glCoords[glCoordsIndex++]= vv[0].y; +1417 glCoords[glCoordsIndex++]= 0; +1418 +1419 glCoords[glCoordsIndex++]= vv[1].x; +1420 glCoords[glCoordsIndex++]= vv[1].y; +1421 glCoords[glCoordsIndex++]= 0; +1422 +1423 glCoords[glCoordsIndex++]= vv[2].x; +1424 glCoords[glCoordsIndex++]= vv[2].y; +1425 glCoords[glCoordsIndex++]= 0; +1426 +1427 glCoords[glCoordsIndex++]= vv[3].x; +1428 glCoords[glCoordsIndex++]= vv[3].y; +1429 glCoords[glCoordsIndex++]= 0; +1430 +1431 }, +1432 /** +1433 * Set UV for this actor's quad. +1434 * +1435 * @param uvBuffer {Float32Array} +1436 * @param uvIndex {number} +1437 */ +1438 setUV : function( uvBuffer, uvIndex ) { +1439 this.backgroundImage.setUV(uvBuffer, uvIndex); +1440 }, +1441 /** +1442 * Test for compulsory gl flushing: +1443 * 1.- opacity has changed. +1444 * 2.- texture page has changed. +1445 * +1446 */ +1447 glNeedsFlush : function(director) { +1448 if ( this.getTextureGLPage()!==director.currentTexturePage ) { +1449 return true; +1450 } +1451 if ( this.frameAlpha!==director.currentOpacity ) { +1452 return true; +1453 } +1454 return false; +1455 }, +1456 /** +1457 * Change texture shader program parameters. +1458 * @param director +1459 */ +1460 glSetShader : function(director) { +1461 +1462 var tp= this.getTextureGLPage(); +1463 if ( tp!==director.currentTexturePage ) { +1464 director.setGLTexturePage(tp); +1465 } +1466 +1467 if ( this.frameAlpha!==director.currentOpacity ) { +1468 director.setGLCurrentOpacity(this.frameAlpha); 1469 } -1470 -1471 return this; -1472 }, -1473 /** -1474 * Set this Actor's clipping area. -1475 * @param enable {boolean} enable clip area. -1476 * @param clipPath {CAAT.Path=} An optional path to apply clip with. If enabled and clipPath is not set, -1477 * a rectangle will be used. -1478 */ -1479 setClip : function( enable, clipPath ) { -1480 this.clip= enable; -1481 this.clipPath= clipPath; +1470 }, +1471 /** +1472 * @private. +1473 * This method is called after the Director has transformed and drawn a whole frame. +1474 * +1475 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. +1476 * @param time an integer indicating the Scene time when the bounding box is to be drawn. +1477 * @return this +1478 * +1479 * @deprecated +1480 */ +1481 endAnimate : function(director,time) { 1482 return this; 1483 }, -1484 /** -1485 * -1486 * @param time {Number=} -1487 * @return this -1488 */ -1489 cacheAsBitmap : function(time) { -1490 time= time||0; -1491 var canvas= document.createElement('canvas'); -1492 canvas.width= this.width; -1493 canvas.height= this.height; -1494 var ctx= canvas.getContext('2d'); -1495 var director= { -1496 ctx: ctx, -1497 crc: ctx, -1498 modelViewMatrix: new CAAT.Matrix() -1499 }; -1500 -1501 this.paintActor(director,time); -1502 this.setBackgroundImage(canvas); -1503 return this; -1504 }, -1505 /** -1506 * Set this actor behavior as if it were a Button. The actor size will be set as SpriteImage's -1507 * single size. -1508 * -1509 * @param buttonImage {CAAT.SpriteImage} sprite image with button's state images. -1510 * @param _iNormal {number} button's normal state image index -1511 * @param _iOver {number} button's mouse over state image index -1512 * @param _iPress {number} button's pressed state image index -1513 * @param _iDisabled {number} button's disabled state image index -1514 * @param fn {function(button{CAAT.Actor})} callback function -1515 */ -1516 setAsButton : function( buttonImage, iNormal, iOver, iPress, iDisabled, fn ) { -1517 -1518 var me= this; -1519 -1520 this.setBackgroundImage(buttonImage, true); -1521 -1522 this.iNormal= iNormal || 0; -1523 this.iOver= iOver || iNormal; -1524 this.iPress= iPress || iNormal; -1525 this.iDisabled= iDisabled || iNormal; -1526 this.fnOnClick= fn; -1527 this.enabled= true; -1528 -1529 this.setSpriteIndex( iNormal ); -1530 -1531 /** -1532 * Enable or disable the button. -1533 * @param enabled {boolean} -1534 * @ignore -1535 */ -1536 this.setEnabled= function( enabled ) { -1537 this.enabled= enabled; -1538 this.setSpriteIndex( this.enabled ? this.iNormal : this.iDisabled ); -1539 }; -1540 -1541 /** -1542 * This method will be called by CAAT *before* the mouseUp event is fired. -1543 * @param event {CAAT.MouseEvent} -1544 * @ignore -1545 */ -1546 this.actionPerformed= function(event) { -1547 if ( this.enabled && null!==this.fnOnClick ) { -1548 this.fnOnClick(this); -1549 } -1550 }; -1551 -1552 /** -1553 * Button's mouse enter handler. It makes the button provide visual feedback -1554 * @param mouseEvent {CAAT.MouseEvent} -1555 * @ignore -1556 */ -1557 this.mouseEnter= function(mouseEvent) { -1558 if ( !this.enabled ) { -1559 return; -1560 } -1561 -1562 if ( this.dragging ) { -1563 this.setSpriteIndex( this.iPress ); -1564 } else { -1565 this.setSpriteIndex( this.iOver ); -1566 } -1567 CAAT.setCursor('pointer'); -1568 }; -1569 -1570 /** -1571 * Button's mouse exit handler. Release visual apperance. -1572 * @param mouseEvent {CAAT.MouseEvent} -1573 * @ignore -1574 */ -1575 this.mouseExit= function(mouseEvent) { -1576 if ( !this.enabled ) { -1577 return; -1578 } -1579 -1580 this.setSpriteIndex( this.iNormal ); -1581 CAAT.setCursor('default'); -1582 }; -1583 -1584 /** -1585 * Button's mouse down handler. -1586 * @param mouseEvent {CAAT.MouseEvent} -1587 * @ignore -1588 */ -1589 this.mouseDown= function(mouseEvent) { -1590 if ( !this.enabled ) { -1591 return; -1592 } -1593 -1594 this.setSpriteIndex( this.iPress ); -1595 }; -1596 -1597 /** -1598 * Button's mouse up handler. -1599 * @param mouseEvent {CAAT.MouseEvent} -1600 * @ignore -1601 */ -1602 this.mouseUp= function(mouseEvent) { -1603 if ( !this.enabled ) { -1604 return; -1605 } -1606 -1607 this.setSpriteIndex( this.iNormal ); -1608 this.dragging= false; -1609 }; -1610 -1611 /** -1612 * Button's mouse click handler. Do nothing by default. This event handler will be -1613 * called ONLY if it has not been drag on the button. -1614 * @param mouseEvent {CAAT.MouseEvent} -1615 * @ignore -1616 */ -1617 this.mouseClick= function(mouseEvent) { -1618 }; -1619 -1620 /** -1621 * Button's mouse drag handler. -1622 * @param mouseEvent {CAAT.MouseEvent} -1623 * @ignore -1624 */ -1625 this.mouseDrag= function(mouseEvent) { -1626 if ( !this.enabled ) { -1627 return; -1628 } -1629 -1630 this.dragging= true; -1631 }; -1632 -1633 this.setButtonImageIndex= function(_normal, _over, _press, _disabled ) { -1634 this.iNormal= _normal; -1635 this.iOver= _over; -1636 this.iPress= _press; -1637 this.iDisabled= _disabled; -1638 this.setSpriteIndex( this.iNormal ); -1639 return this; -1640 }; -1641 -1642 return this; -1643 } -1644 }; -1645 -1646 if ( CAAT.NO_PERF ) { -1647 CAAT.Actor.prototype.paintActor= CAAT.Actor.prototype.__paintActor; -1648 } +1484 initialize : function(overrides) { +1485 if (overrides) { +1486 for (var i in overrides) { +1487 this[i] = overrides[i]; +1488 } +1489 } +1490 +1491 return this; +1492 }, +1493 /** +1494 * Set this Actor's clipping area. +1495 * @param enable {boolean} enable clip area. +1496 * @param clipPath {CAAT.Path=} An optional path to apply clip with. If enabled and clipPath is not set, +1497 * a rectangle will be used. +1498 */ +1499 setClip : function( enable, clipPath ) { +1500 this.clip= enable; +1501 this.clipPath= clipPath; +1502 return this; +1503 }, +1504 /** +1505 * +1506 * @param time {Number=} +1507 * @return this +1508 */ +1509 cacheAsBitmap : function(time) { +1510 time= time||0; +1511 var canvas= document.createElement('canvas'); +1512 canvas.width= this.width; +1513 canvas.height= this.height; +1514 var ctx= canvas.getContext('2d'); +1515 var director= { +1516 ctx: ctx, +1517 crc: ctx, +1518 modelViewMatrix: new CAAT.Matrix() +1519 }; +1520 +1521 this.paintActor(director,time); +1522 this.setBackgroundImage(canvas); +1523 return this; +1524 }, +1525 /** +1526 * Set this actor behavior as if it were a Button. The actor size will be set as SpriteImage's +1527 * single size. +1528 * +1529 * @param buttonImage {CAAT.SpriteImage} sprite image with button's state images. +1530 * @param _iNormal {number} button's normal state image index +1531 * @param _iOver {number} button's mouse over state image index +1532 * @param _iPress {number} button's pressed state image index +1533 * @param _iDisabled {number} button's disabled state image index +1534 * @param fn {function(button{CAAT.Actor})} callback function +1535 */ +1536 setAsButton : function( buttonImage, iNormal, iOver, iPress, iDisabled, fn ) { +1537 +1538 var me= this; +1539 +1540 this.setBackgroundImage(buttonImage, true); +1541 +1542 this.iNormal= iNormal || 0; +1543 this.iOver= iOver || iNormal; +1544 this.iPress= iPress || iNormal; +1545 this.iDisabled= iDisabled || iNormal; +1546 this.fnOnClick= fn; +1547 this.enabled= true; +1548 +1549 this.setSpriteIndex( iNormal ); +1550 +1551 /** +1552 * Enable or disable the button. +1553 * @param enabled {boolean} +1554 * @ignore +1555 */ +1556 this.setEnabled= function( enabled ) { +1557 this.enabled= enabled; +1558 this.setSpriteIndex( this.enabled ? this.iNormal : this.iDisabled ); +1559 }; +1560 +1561 /** +1562 * This method will be called by CAAT *before* the mouseUp event is fired. +1563 * @param event {CAAT.MouseEvent} +1564 * @ignore +1565 */ +1566 this.actionPerformed= function(event) { +1567 if ( this.enabled && null!==this.fnOnClick ) { +1568 this.fnOnClick(this); +1569 } +1570 }; +1571 +1572 /** +1573 * Button's mouse enter handler. It makes the button provide visual feedback +1574 * @param mouseEvent {CAAT.MouseEvent} +1575 * @ignore +1576 */ +1577 this.mouseEnter= function(mouseEvent) { +1578 if ( !this.enabled ) { +1579 return; +1580 } +1581 +1582 if ( this.dragging ) { +1583 this.setSpriteIndex( this.iPress ); +1584 } else { +1585 this.setSpriteIndex( this.iOver ); +1586 } +1587 CAAT.setCursor('pointer'); +1588 }; +1589 +1590 /** +1591 * Button's mouse exit handler. Release visual apperance. +1592 * @param mouseEvent {CAAT.MouseEvent} +1593 * @ignore +1594 */ +1595 this.mouseExit= function(mouseEvent) { +1596 if ( !this.enabled ) { +1597 return; +1598 } +1599 +1600 this.setSpriteIndex( this.iNormal ); +1601 CAAT.setCursor('default'); +1602 }; +1603 +1604 /** +1605 * Button's mouse down handler. +1606 * @param mouseEvent {CAAT.MouseEvent} +1607 * @ignore +1608 */ +1609 this.mouseDown= function(mouseEvent) { +1610 if ( !this.enabled ) { +1611 return; +1612 } +1613 +1614 this.setSpriteIndex( this.iPress ); +1615 }; +1616 +1617 /** +1618 * Button's mouse up handler. +1619 * @param mouseEvent {CAAT.MouseEvent} +1620 * @ignore +1621 */ +1622 this.mouseUp= function(mouseEvent) { +1623 if ( !this.enabled ) { +1624 return; +1625 } +1626 +1627 this.setSpriteIndex( this.iNormal ); +1628 this.dragging= false; +1629 }; +1630 +1631 /** +1632 * Button's mouse click handler. Do nothing by default. This event handler will be +1633 * called ONLY if it has not been drag on the button. +1634 * @param mouseEvent {CAAT.MouseEvent} +1635 * @ignore +1636 */ +1637 this.mouseClick= function(mouseEvent) { +1638 }; +1639 +1640 /** +1641 * Button's mouse drag handler. +1642 * @param mouseEvent {CAAT.MouseEvent} +1643 * @ignore +1644 */ +1645 this.mouseDrag= function(mouseEvent) { +1646 if ( !this.enabled ) { +1647 return; +1648 } 1649 -1650 })(); -1651 -1652 (function() { -1653 -1654 /** -1655 * This class is a general container of CAAT.Actor instances. It extends the concept of an Actor -1656 * from a single entity on screen to a set of entities with a parent/children relationship among -1657 * them. -1658 * <p> -1659 * This mainly overrides default behavior of a single entity and exposes methods to manage its children -1660 * collection. -1661 * -1662 * @constructor -1663 * @extends CAAT.Actor -1664 */ -1665 CAAT.ActorContainer= function(hint) { -1666 -1667 CAAT.ActorContainer.superclass.constructor.call(this); -1668 this.childrenList= []; -1669 this.pendingChildrenList= []; -1670 if ( typeof hint!=='undefined' ) { -1671 this.addHint= hint; -1672 this.boundingBox= new CAAT.Rectangle(); -1673 } -1674 return this; -1675 }; -1676 -1677 CAAT.ActorContainer.AddHint= { -1678 CONFORM : 1 -1679 }; -1680 -1681 CAAT.ActorContainer.prototype= { -1682 -1683 childrenList : null, // the list of children contained. -1684 activeChildren : null, -1685 pendingChildrenList : null, +1650 this.dragging= true; +1651 }; +1652 +1653 this.setButtonImageIndex= function(_normal, _over, _press, _disabled ) { +1654 this.iNormal= _normal; +1655 this.iOver= _over; +1656 this.iPress= _press; +1657 this.iDisabled= _disabled; +1658 this.setSpriteIndex( this.iNormal ); +1659 return this; +1660 }; +1661 +1662 return this; +1663 } +1664 }; +1665 +1666 if ( CAAT.NO_PERF ) { +1667 CAAT.Actor.prototype.paintActor= CAAT.Actor.prototype.__paintActor; +1668 } +1669 +1670 })(); +1671 +1672 (function() { +1673 +1674 /** +1675 * This class is a general container of CAAT.Actor instances. It extends the concept of an Actor +1676 * from a single entity on screen to a set of entities with a parent/children relationship among +1677 * them. +1678 * <p> +1679 * This mainly overrides default behavior of a single entity and exposes methods to manage its children +1680 * collection. +1681 * +1682 * @constructor +1683 * @extends CAAT.Actor +1684 */ +1685 CAAT.ActorContainer= function(hint) { 1686 -1687 addHint : 0, -1688 boundingBox : null, -1689 runion : new CAAT.Rectangle(), // Watch out. one for every container. -1690 -1691 /** -1692 * Draws this ActorContainer and all of its children screen bounding box. -1693 * -1694 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. -1695 * @param time an integer indicating the Scene time when the bounding box is to be drawn. -1696 */ -1697 drawScreenBoundingBox : function( director, time ) { -1698 -1699 if (!this.inFrame) { -1700 return; -1701 } +1687 CAAT.ActorContainer.superclass.constructor.call(this); +1688 this.childrenList= []; +1689 this.pendingChildrenList= []; +1690 if ( typeof hint!=='undefined' ) { +1691 this.addHint= hint; +1692 this.boundingBox= new CAAT.Rectangle(); +1693 } +1694 return this; +1695 }; +1696 +1697 CAAT.ActorContainer.AddHint= { +1698 CONFORM : 1 +1699 }; +1700 +1701 CAAT.ActorContainer.prototype= { 1702 -1703 var cl= this.childrenList; -1704 for( var i=0; i<cl.length; i++ ) { -1705 cl[i].drawScreenBoundingBox(director,time); -1706 } -1707 CAAT.ActorContainer.superclass.drawScreenBoundingBox.call(this,director,time); -1708 -1709 }, -1710 /** -1711 * Removes all children from this ActorContainer. -1712 * -1713 * @return this -1714 */ -1715 emptyChildren : function() { -1716 this.childrenList= []; -1717 -1718 return this; -1719 }, -1720 /** -1721 * Private -1722 * Paints this container and every contained children. -1723 * -1724 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. -1725 * @param time an integer indicating the Scene time when the bounding box is to be drawn. -1726 */ -1727 paintActor : function(director, time ) { +1703 childrenList : null, // the list of children contained. +1704 activeChildren : null, +1705 pendingChildrenList : null, +1706 +1707 addHint : 0, +1708 boundingBox : null, +1709 runion : new CAAT.Rectangle(), // Watch out. one for every container. +1710 +1711 /** +1712 * Draws this ActorContainer and all of its children screen bounding box. +1713 * +1714 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. +1715 * @param time an integer indicating the Scene time when the bounding box is to be drawn. +1716 */ +1717 drawScreenBoundingBox : function( director, time ) { +1718 +1719 if (!this.inFrame) { +1720 return; +1721 } +1722 +1723 var cl= this.childrenList; +1724 for( var i=0; i<cl.length; i++ ) { +1725 cl[i].drawScreenBoundingBox(director,time); +1726 } +1727 CAAT.ActorContainer.superclass.drawScreenBoundingBox.call(this,director,time); 1728 -1729 if (!this.visible) { -1730 return true; -1731 } -1732 -1733 var ctx= director.ctx; -1734 var dmvm= director.modelViewMatrix; -1735 -1736 ctx.save(); -1737 // dmvm.transformRenderingContextSet( ctx ); -1738 -1739 CAAT.ActorContainer.superclass.paintActor.call(this,director,time); -1740 if ( !this.isGlobalAlpha ) { -1741 this.frameAlpha= this.parent ? this.parent.frameAlpha : 1; -1742 } -1743 -1744 for( var actor= this.activeChildren; actor; actor=actor.__next ) { -1745 if ( actor.visible ) { -1746 dmvm.transformRenderingContextSet( ctx ); -1747 ctx.save(); -1748 actor.paintActor(director,time); -1749 ctx.restore(); -1750 } +1729 }, +1730 /** +1731 * Removes all children from this ActorContainer. +1732 * +1733 * @return this +1734 */ +1735 emptyChildren : function() { +1736 this.childrenList= []; +1737 +1738 return this; +1739 }, +1740 /** +1741 * Private +1742 * Paints this container and every contained children. +1743 * +1744 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. +1745 * @param time an integer indicating the Scene time when the bounding box is to be drawn. +1746 */ +1747 paintActor : function(director, time ) { +1748 +1749 if (!this.visible) { +1750 return true; 1751 } -1752 ctx.restore(); -1753 -1754 return true; -1755 }, -1756 __paintActor : function(director, time ) { -1757 if (!this.visible) { -1758 return true; -1759 } -1760 -1761 var ctx= director.ctx; -1762 -1763 this.frameAlpha= this.parent ? this.parent.frameAlpha*this.alpha : 1; -1764 var m= this.worldModelViewMatrix.matrix; -1765 ctx.setTransform( m[0], m[3], m[1], m[4], m[2], m[5], this.frameAlpha ); -1766 this.paint(director, time); -1767 -1768 if ( !this.isGlobalAlpha ) { -1769 this.frameAlpha= this.parent ? this.parent.frameAlpha : 1; -1770 } -1771 -1772 for( var actor= this.activeChildren; actor; actor=actor.__next ) { -1773 actor.paintActor(director,time); -1774 } -1775 return true; -1776 }, -1777 paintActorGL : function(director,time) { -1778 -1779 var i, c; -1780 if (!this.visible) { -1781 return true; +1752 +1753 var ctx= director.ctx; +1754 +1755 CAAT.ActorContainer.superclass.paintActor.call(this,director,time); +1756 if ( !this.isGlobalAlpha ) { +1757 this.frameAlpha= this.parent ? this.parent.frameAlpha : 1; +1758 } +1759 +1760 for( var actor= this.activeChildren; actor; actor=actor.__next ) { +1761 if ( actor.visible ) { +1762 actor.paintActor(director,time); +1763 } +1764 } +1765 +1766 return true; +1767 }, +1768 __paintActor : function(director, time ) { +1769 if (!this.visible) { +1770 return true; +1771 } +1772 +1773 var ctx= director.ctx; +1774 +1775 this.frameAlpha= this.parent ? this.parent.frameAlpha*this.alpha : 1; +1776 var m= this.worldModelViewMatrix.matrix; +1777 ctx.setTransform( m[0], m[3], m[1], m[4], m[2], m[5], this.frameAlpha ); +1778 this.paint(director, time); +1779 +1780 if ( !this.isGlobalAlpha ) { +1781 this.frameAlpha= this.parent ? this.parent.frameAlpha : 1; 1782 } 1783 -1784 CAAT.ActorContainer.superclass.paintActorGL.call(this,director,time); -1785 -1786 if ( !this.isGlobalAlpha ) { -1787 this.frameAlpha= this.parent.frameAlpha; -1788 } -1789 -1790 for( c= this.activeChildren; c; c=c.__next ) { -1791 c.paintActorGL(director,time); -1792 } -1793 -1794 }, -1795 /** -1796 * Private. -1797 * Performs the animate method for this ActorContainer and every contained Actor. -1798 * -1799 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. -1800 * @param time an integer indicating the Scene time when the bounding box is to be drawn. -1801 * -1802 * @return {boolean} is this actor in active children list ?? -1803 */ -1804 animate : function(director,time) { +1784 for( var actor= this.activeChildren; actor; actor=actor.__next ) { +1785 actor.paintActor(director,time); +1786 } +1787 return true; +1788 }, +1789 paintActorGL : function(director,time) { +1790 +1791 var i, c; +1792 if (!this.visible) { +1793 return true; +1794 } +1795 +1796 CAAT.ActorContainer.superclass.paintActorGL.call(this,director,time); +1797 +1798 if ( !this.isGlobalAlpha ) { +1799 this.frameAlpha= this.parent.frameAlpha; +1800 } +1801 +1802 for( c= this.activeChildren; c; c=c.__next ) { +1803 c.paintActorGL(director,time); +1804 } 1805 -1806 this.activeChildren= null; -1807 var last= null; -1808 -1809 if (false===CAAT.ActorContainer.superclass.animate.call(this,director,time)) { -1810 return false; -1811 } -1812 -1813 var i,l; -1814 -1815 /** -1816 * Incluir los actores pendientes. -1817 * El momento es ahora, antes de procesar ninguno del contenedor. -1818 */ -1819 var pcl= this.pendingChildrenList; -1820 for( i=0; i<pcl.length; i++ ) { -1821 var child= pcl[i]; -1822 this.addChild(child); +1806 }, +1807 /** +1808 * Private. +1809 * Performs the animate method for this ActorContainer and every contained Actor. +1810 * +1811 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. +1812 * @param time an integer indicating the Scene time when the bounding box is to be drawn. +1813 * +1814 * @return {boolean} is this actor in active children list ?? +1815 */ +1816 animate : function(director,time) { +1817 +1818 this.activeChildren= null; +1819 var last= null; +1820 +1821 if (false===CAAT.ActorContainer.superclass.animate.call(this,director,time)) { +1822 return false; 1823 } 1824 -1825 this.pendingChildrenList= []; -1826 var markDelete= []; -1827 -1828 var cl= this.childrenList; -1829 this.activeChildren= null; -1830 this.size_active= 0; -1831 this.size_total= 0; -1832 for( i=0; i<cl.length; i++ ) { -1833 var actor= cl[i]; -1834 actor.time= time; -1835 this.size_total+= actor.size_total; -1836 if ( actor.animate(director, time) ) { -1837 if ( !this.activeChildren ) { -1838 this.activeChildren= actor; -1839 actor.__next= null; -1840 last= actor; -1841 } else { -1842 actor.__next= null; -1843 last.__next= actor; -1844 last= actor; -1845 } -1846 -1847 this.size_active+= actor.size_active; -1848 -1849 } else { -1850 if ( actor.expired && actor.discardable ) { -1851 markDelete.push(actor); -1852 } -1853 } -1854 } -1855 -1856 for( i=0, l=markDelete.length; i<l; i++ ) { -1857 markDelete[i].destroy(time); -1858 } -1859 -1860 return true; -1861 }, -1862 /** -1863 * Removes Actors from this ActorContainer which are expired and flagged as Discardable. -1864 * -1865 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. -1866 * @param time an integer indicating the Scene time when the bounding box is to be drawn. -1867 * -1868 * @deprecated -1869 */ -1870 endAnimate : function(director,time) { -1871 }, -1872 /** -1873 * Adds an Actor to this Container. -1874 * The Actor will be added ON METHOD CALL, despite the rendering pipeline stage being executed at -1875 * the time of method call. -1876 * -1877 * This method is only used by CAAT.Director's transitionScene. -1878 * -1879 * @param child a CAAT.Actor instance. -1880 * @return this. -1881 */ -1882 addChildImmediately : function(child) { -1883 return this.addChild(child); -1884 }, -1885 /** -1886 * Adds an Actor to this ActorContainer. -1887 * The Actor will be added to the container AFTER frame animation, and not on method call time. -1888 * Except the Director and in orther to avoid visual artifacts, the developer SHOULD NOT call this -1889 * method directly. -1890 * -1891 * If the container has addingHint as CAAT.ActorContainer.AddHint.CONFORM, new continer size will be -1892 * calculated by summing up the union of every client actor bounding box. -1893 * This method will not take into acount actor's affine transformations, so the bounding box will be -1894 * AABB. -1895 * -1896 * @param child a CAAT.Actor object instance. -1897 * @return this -1898 */ -1899 addChild : function(child) { -1900 -1901 if ( child.parent!=null ) { -1902 throw('adding to a container an element with parent.'); -1903 } -1904 -1905 child.parent= this; -1906 this.childrenList.push(child); -1907 child.dirty= true; -1908 -1909 /** -1910 * if Conforming size, recalc new bountainer size. -1911 */ -1912 if ( this.addHint===CAAT.ActorContainer.AddHint.CONFORM ) { -1913 this.recalcSize(); -1914 } -1915 -1916 return this; -1917 }, -1918 -1919 /** -1920 * Recalc this container size by computin the union of every children bounding box. -1921 */ -1922 recalcSize : function() { -1923 var bb= this.boundingBox; -1924 bb.setEmpty(); -1925 var cl= this.childrenList; -1926 var ac; -1927 for( var i=0; i<cl.length; i++ ) { -1928 ac= cl[i]; -1929 this.runion.setBounds( -1930 ac.x<0 ? 0 : ac.x, -1931 ac.y<0 ? 0 : ac.y, -1932 ac.width, -1933 ac.height ); -1934 bb.unionRectangle( this.runion ); -1935 } -1936 this.setSize( bb.x1, bb.y1 ); -1937 -1938 return this; -1939 }, -1940 -1941 /** -1942 * Add a child element and make it active in the next frame. -1943 * @param child {CAAT.Actor} -1944 */ -1945 addChildDelayed : function(child) { -1946 this.pendingChildrenList.push(child); -1947 return this; -1948 }, -1949 /** -1950 * Adds an Actor to this ActorContainer. -1951 * -1952 * @param child a CAAT.Actor object instance. -1953 * -1954 * @return this -1955 */ -1956 addChildAt : function(child, index) { -1957 -1958 if( index <= 0 ) { -1959 child.parent= this; -1960 child.dirty= true; -1961 //this.childrenList.unshift(child); // unshift unsupported on IE -1962 this.childrenList.splice( 0, 0, child ); -1963 return this; -1964 } else { -1965 if ( index>=this.childrenList.length ) { -1966 index= this.childrenList.length; -1967 } -1968 } -1969 -1970 child.parent= this; -1971 child.dirty= true; -1972 this.childrenList.splice(index, 0, child); +1825 var i,l; +1826 +1827 /** +1828 * Incluir los actores pendientes. +1829 * El momento es ahora, antes de procesar ninguno del contenedor. +1830 */ +1831 var pcl= this.pendingChildrenList; +1832 for( i=0; i<pcl.length; i++ ) { +1833 var child= pcl[i]; +1834 this.addChild(child); +1835 } +1836 +1837 this.pendingChildrenList= []; +1838 var markDelete= []; +1839 +1840 var cl= this.childrenList; +1841 this.activeChildren= null; +1842 this.size_active= 0; +1843 this.size_total= 0; +1844 for( i=0; i<cl.length; i++ ) { +1845 var actor= cl[i]; +1846 actor.time= time; +1847 this.size_total+= actor.size_total; +1848 if ( actor.animate(director, time) ) { +1849 if ( !this.activeChildren ) { +1850 this.activeChildren= actor; +1851 actor.__next= null; +1852 last= actor; +1853 } else { +1854 actor.__next= null; +1855 last.__next= actor; +1856 last= actor; +1857 } +1858 +1859 this.size_active+= actor.size_active; +1860 +1861 } else { +1862 if ( actor.expired && actor.discardable ) { +1863 markDelete.push(actor); +1864 } +1865 } +1866 } +1867 +1868 for( i=0, l=markDelete.length; i<l; i++ ) { +1869 var md= markDelete[i]; +1870 md.destroy(time); +1871 if ( !director.dirtyRectsEnabled ) { +1872 director.addDirtyRect( md.AABB ); +1873 } +1874 } +1875 +1876 return true; +1877 }, +1878 /** +1879 * Removes Actors from this ActorContainer which are expired and flagged as Discardable. +1880 * +1881 * @param director the CAAT.Director object instance that contains the Scene the Actor is in. +1882 * @param time an integer indicating the Scene time when the bounding box is to be drawn. +1883 * +1884 * @deprecated +1885 */ +1886 endAnimate : function(director,time) { +1887 }, +1888 /** +1889 * Adds an Actor to this Container. +1890 * The Actor will be added ON METHOD CALL, despite the rendering pipeline stage being executed at +1891 * the time of method call. +1892 * +1893 * This method is only used by CAAT.Director's transitionScene. +1894 * +1895 * @param child a CAAT.Actor instance. +1896 * @return this. +1897 */ +1898 addChildImmediately : function(child) { +1899 return this.addChild(child); +1900 }, +1901 /** +1902 * Adds an Actor to this ActorContainer. +1903 * The Actor will be added to the container AFTER frame animation, and not on method call time. +1904 * Except the Director and in orther to avoid visual artifacts, the developer SHOULD NOT call this +1905 * method directly. +1906 * +1907 * If the container has addingHint as CAAT.ActorContainer.AddHint.CONFORM, new continer size will be +1908 * calculated by summing up the union of every client actor bounding box. +1909 * This method will not take into acount actor's affine transformations, so the bounding box will be +1910 * AABB. +1911 * +1912 * @param child a CAAT.Actor object instance. +1913 * @return this +1914 */ +1915 addChild : function(child) { +1916 +1917 if ( child.parent!=null ) { +1918 throw('adding to a container an element with parent.'); +1919 } +1920 +1921 child.parent= this; +1922 this.childrenList.push(child); +1923 child.dirty= true; +1924 +1925 /** +1926 * if Conforming size, recalc new bountainer size. +1927 */ +1928 if ( this.addHint===CAAT.ActorContainer.AddHint.CONFORM ) { +1929 this.recalcSize(); +1930 } +1931 +1932 return this; +1933 }, +1934 +1935 /** +1936 * Recalc this container size by computin the union of every children bounding box. +1937 */ +1938 recalcSize : function() { +1939 var bb= this.boundingBox; +1940 bb.setEmpty(); +1941 var cl= this.childrenList; +1942 var ac; +1943 for( var i=0; i<cl.length; i++ ) { +1944 ac= cl[i]; +1945 this.runion.setBounds( +1946 ac.x<0 ? 0 : ac.x, +1947 ac.y<0 ? 0 : ac.y, +1948 ac.width, +1949 ac.height ); +1950 bb.unionRectangle( this.runion ); +1951 } +1952 this.setSize( bb.x1, bb.y1 ); +1953 +1954 return this; +1955 }, +1956 +1957 /** +1958 * Add a child element and make it active in the next frame. +1959 * @param child {CAAT.Actor} +1960 */ +1961 addChildDelayed : function(child) { +1962 this.pendingChildrenList.push(child); +1963 return this; +1964 }, +1965 /** +1966 * Adds an Actor to this ActorContainer. +1967 * +1968 * @param child a CAAT.Actor object instance. +1969 * +1970 * @return this +1971 */ +1972 addChildAt : function(child, index) { 1973 -1974 return this; -1975 }, -1976 /** -1977 * Private -1978 * Gets a contained Actor z-index on this ActorContainer. -1979 * -1980 * @param child a CAAT.Actor object instance. -1981 * -1982 * @return an integer indicating the Actor's z-order. -1983 */ -1984 findChild : function(child) { -1985 var cl= this.childrenList; -1986 var i=0; -1987 var len = cl.length; -1988 -1989 for( i=0; i<len; i++ ) { -1990 if ( cl[i]===child ) { -1991 return i; -1992 } -1993 } -1994 return -1; -1995 }, -1996 /** -1997 * Removed an Actor form this ActorContainer. -1998 * If the Actor is not contained into this Container, nothing happends. -1999 * -2000 * @param child a CAAT.Actor object instance. -2001 * -2002 * @return this -2003 */ -2004 removeChild : function(child) { -2005 var pos= this.findChild(child); -2006 var cl= this.childrenList; -2007 if ( -1!==pos ) { -2008 cl[pos].setParent(null); -2009 cl.splice(pos,1); -2010 } -2011 -2012 return this; -2013 }, -2014 /** -2015 * @private -2016 * -2017 * Gets the Actor inside this ActorContainer at a given Screen coordinate. -2018 * -2019 * @param point an object of the form { x: float, y: float } -2020 * -2021 * @return the Actor contained inside this ActorContainer if found, or the ActorContainer itself. -2022 */ -2023 findActorAtPosition : function(point) { -2024 -2025 if( null===CAAT.ActorContainer.superclass.findActorAtPosition.call(this,point) ) { -2026 return null; -2027 } -2028 -2029 // z-order -2030 var cl= this.childrenList; -2031 for( var i=cl.length-1; i>=0; i-- ) { -2032 var child= this.childrenList[i]; -2033 -2034 var np= new CAAT.Point( point.x, point.y, 0 ); -2035 var contained= child.findActorAtPosition( np ); -2036 if ( null!==contained ) { -2037 return contained; -2038 } -2039 } +1974 if( index <= 0 ) { +1975 child.parent= this; +1976 child.dirty= true; +1977 //this.childrenList.unshift(child); // unshift unsupported on IE +1978 this.childrenList.splice( 0, 0, child ); +1979 return this; +1980 } else { +1981 if ( index>=this.childrenList.length ) { +1982 index= this.childrenList.length; +1983 } +1984 } +1985 +1986 child.parent= this; +1987 child.dirty= true; +1988 this.childrenList.splice(index, 0, child); +1989 +1990 return this; +1991 }, +1992 /** +1993 * Private +1994 * Gets a contained Actor z-index on this ActorContainer. +1995 * +1996 * @param child a CAAT.Actor object instance. +1997 * +1998 * @return an integer indicating the Actor's z-order. +1999 */ +2000 findChild : function(child) { +2001 var cl= this.childrenList; +2002 var i=0; +2003 var len = cl.length; +2004 +2005 for( i=0; i<len; i++ ) { +2006 if ( cl[i]===child ) { +2007 return i; +2008 } +2009 } +2010 return -1; +2011 }, +2012 /** +2013 * Removed an Actor form this ActorContainer. +2014 * If the Actor is not contained into this Container, nothing happends. +2015 * +2016 * @param child a CAAT.Actor object instance. +2017 * +2018 * @return this +2019 */ +2020 removeChild : function(child) { +2021 var pos= this.findChild(child); +2022 var cl= this.childrenList; +2023 if ( -1!==pos ) { +2024 cl[pos].setParent(null); +2025 cl.splice(pos,1); +2026 } +2027 +2028 return this; +2029 }, +2030 /** +2031 * @private +2032 * +2033 * Gets the Actor inside this ActorContainer at a given Screen coordinate. +2034 * +2035 * @param point an object of the form { x: float, y: float } +2036 * +2037 * @return the Actor contained inside this ActorContainer if found, or the ActorContainer itself. +2038 */ +2039 findActorAtPosition : function(point) { 2040 -2041 return this; -2042 }, -2043 /** -2044 * Destroys this ActorContainer. -2045 * The process falls down recursively for each contained Actor into this ActorContainer. -2046 * -2047 * @return this -2048 */ -2049 destroy : function() { -2050 var cl= this.childrenList; -2051 for( var i=cl.length-1; i>=0; i-- ) { -2052 cl[i].destroy(); -2053 } -2054 CAAT.ActorContainer.superclass.destroy.call(this); -2055 -2056 return this; -2057 }, -2058 /** -2059 * Get number of Actors into this container. -2060 * @return integer indicating the number of children. -2061 */ -2062 getNumChildren : function() { -2063 return this.childrenList.length; -2064 }, -2065 getNumActiveChildren : function() { -2066 return this.activeChildren.length; -2067 }, -2068 /** -2069 * Returns the Actor at the iPosition(th) position. -2070 * @param iPosition an integer indicating the position array. -2071 * @return the CAAT.Actor object at position. -2072 */ -2073 getChildAt : function( iPosition ) { -2074 return this.childrenList[ iPosition ]; -2075 }, -2076 /** -2077 * Changes an actor's ZOrder. -2078 * @param actor the actor to change ZOrder for -2079 * @param index an integer indicating the new ZOrder. a value greater than children list size means to be the -2080 * last ZOrder Actor. -2081 */ -2082 setZOrder : function( actor, index ) { -2083 var actorPos= this.findChild(actor); -2084 // the actor is present -2085 if ( -1!==actorPos ) { -2086 var cl= this.childrenList; -2087 // trivial reject. -2088 if ( index===actorPos ) { -2089 return; -2090 } -2091 -2092 if ( index>=cl.length ) { -2093 cl.splice(actorPos,1); -2094 cl.push(actor); -2095 } else { -2096 var nActor= cl.splice(actorPos,1); -2097 if ( index<0 ) { -2098 index=0; -2099 } else if ( index>cl.length ) { -2100 index= cl.length; -2101 } -2102 -2103 //cl.splice( index, 1, nActor ); -2104 cl.splice( index, 0, nActor[0] ); -2105 } -2106 } -2107 } -2108 }; -2109 -2110 if ( CAAT.NO_PERF ) { -2111 CAAT.ActorContainer.prototype.paintActor= CAAT.ActorContainer.prototype.__paintActor; -2112 } -2113 -2114 extend( CAAT.ActorContainer, CAAT.Actor, null); -2115 -2116 })(); -2117 +2041 if( null===CAAT.ActorContainer.superclass.findActorAtPosition.call(this,point) ) { +2042 return null; +2043 } +2044 +2045 // z-order +2046 var cl= this.childrenList; +2047 for( var i=cl.length-1; i>=0; i-- ) { +2048 var child= this.childrenList[i]; +2049 +2050 var np= new CAAT.Point( point.x, point.y, 0 ); +2051 var contained= child.findActorAtPosition( np ); +2052 if ( null!==contained ) { +2053 return contained; +2054 } +2055 } +2056 +2057 return this; +2058 }, +2059 /** +2060 * Destroys this ActorContainer. +2061 * The process falls down recursively for each contained Actor into this ActorContainer. +2062 * +2063 * @return this +2064 */ +2065 destroy : function() { +2066 var cl= this.childrenList; +2067 for( var i=cl.length-1; i>=0; i-- ) { +2068 cl[i].destroy(); +2069 } +2070 CAAT.ActorContainer.superclass.destroy.call(this); +2071 +2072 return this; +2073 }, +2074 /** +2075 * Get number of Actors into this container. +2076 * @return integer indicating the number of children. +2077 */ +2078 getNumChildren : function() { +2079 return this.childrenList.length; +2080 }, +2081 getNumActiveChildren : function() { +2082 return this.activeChildren.length; +2083 }, +2084 /** +2085 * Returns the Actor at the iPosition(th) position. +2086 * @param iPosition an integer indicating the position array. +2087 * @return the CAAT.Actor object at position. +2088 */ +2089 getChildAt : function( iPosition ) { +2090 return this.childrenList[ iPosition ]; +2091 }, +2092 /** +2093 * Changes an actor's ZOrder. +2094 * @param actor the actor to change ZOrder for +2095 * @param index an integer indicating the new ZOrder. a value greater than children list size means to be the +2096 * last ZOrder Actor. +2097 */ +2098 setZOrder : function( actor, index ) { +2099 var actorPos= this.findChild(actor); +2100 // the actor is present +2101 if ( -1!==actorPos ) { +2102 var cl= this.childrenList; +2103 // trivial reject. +2104 if ( index===actorPos ) { +2105 return; +2106 } +2107 +2108 if ( index>=cl.length ) { +2109 cl.splice(actorPos,1); +2110 cl.push(actor); +2111 } else { +2112 var nActor= cl.splice(actorPos,1); +2113 if ( index<0 ) { +2114 index=0; +2115 } else if ( index>cl.length ) { +2116 index= cl.length; +2117 } 2118 -2119 (function() { -2120 -2121 /** -2122 * TextActor draws text on screen. The text can be drawn directly on screen or make if follow a -2123 * path defined by an instance of <code>CAAT.Path</code>. -2124 * -2125 * @constructor -2126 * @extends CAAT.ActorContainer -2127 * -2128 */ -2129 CAAT.TextActor = function() { -2130 CAAT.TextActor.superclass.constructor.call(this); -2131 this.font= "10px sans-serif"; -2132 this.textAlign= "left"; -2133 this.textBaseline= "top"; -2134 this.outlineColor= "black"; -2135 this.clip= false; +2119 //cl.splice( index, 1, nActor ); +2120 cl.splice( index, 0, nActor[0] ); +2121 } +2122 } +2123 } +2124 }; +2125 +2126 if ( CAAT.NO_PERF ) { +2127 CAAT.ActorContainer.prototype.paintActor= CAAT.ActorContainer.prototype.__paintActor; +2128 } +2129 +2130 extend( CAAT.ActorContainer, CAAT.Actor, null); +2131 +2132 })(); +2133 +2134 +2135 (function() { 2136 -2137 return this; -2138 }; -2139 -2140 CAAT.TextActor.TRAVERSE_PATH_FORWARD= 1; -2141 CAAT.TextActor.TRAVERSE_PATH_BACKWARD= -1; -2142 -2143 CAAT.TextActor.prototype= { -2144 font: null, // a valid canvas rendering context font description. Default font -2145 // will be "10px sans-serif". -2146 textAlign: null, // a valid canvas rendering context textAlign string. Any of: -2147 // start, end, left, right, center. -2148 // defaults to "left". -2149 textBaseline: null, // a valid canvas rendering context textBaseLine string. Any of: -2150 // top, hanging, middle, alphabetic, ideographic, bottom. -2151 // defaults to "top". -2152 fill: true, // a boolean indicating whether the text should be filled. -2153 text: null, // a string with the text to draw. -2154 textWidth: 0, // an integer indicating text width in pixels. -2155 textHeight: 0, // an integer indicating text height in pixels. -2156 outline: false, // a boolean indicating whether the text should be outlined. -2157 // not all browsers support it. -2158 outlineColor: null, // a valid color description string. -2159 -2160 path: null, // a CAAT.Path which will be traversed by the text. [Optional] -2161 pathInterpolator: null, // a CAAT.Interpolator to apply to the path traversing. -2162 pathDuration: 10000, // an integer indicating the time to be taken to traverse the path. ms. -2163 sign: 1, // traverse the path forward or backwards. -2164 -2165 /** -2166 * Set the text to be filled. The default Filling style will be set by calling setFillStyle method. -2167 * Default value is true. -2168 * @param fill {boolean} a boolean indicating whether the text will be filled. -2169 * @return this; -2170 */ -2171 setFill : function( fill ) { -2172 this.fill= fill; -2173 return this; -2174 }, -2175 /** -2176 * Sets whether the text will be outlined. -2177 * @param outline {boolean} a boolean indicating whether the text will be outlined. -2178 * @return this; -2179 */ -2180 setOutline : function( outline ) { -2181 this.outline= outline; -2182 return this; -2183 }, -2184 setPathTraverseDirection : function(direction) { -2185 this.sign= direction; -2186 return this; -2187 }, -2188 /** -2189 * Defines text's outline color. -2190 * -2191 * @param color {string} sets a valid canvas context color. -2192 * @return this. -2193 */ -2194 setOutlineColor : function( color ) { -2195 this.outlineColor= color; -2196 return this; -2197 }, -2198 /** -2199 * Set the text to be shown by the actor. -2200 * @param sText a string with the text to be shwon. -2201 * @return this -2202 */ -2203 setText : function( sText ) { -2204 this.text= sText; -2205 this.setFont( this.font ); -2206 -2207 return this; -2208 }, -2209 setTextAlign : function( align ) { -2210 this.textAlign= align; -2211 return this; -2212 }, -2213 /** -2214 * Sets text alignment -2215 * @param align -2216 * @deprecated use setTextAlign -2217 */ -2218 setAlign : function( align ) { -2219 return this.setTextAlign(align); -2220 }, -2221 /** -2222 * Set text baseline. -2223 * @param baseline -2224 */ -2225 setTextBaseline : function( baseline ) { -2226 this.textBaseline= baseline; +2137 /** +2138 * TextActor draws text on screen. The text can be drawn directly on screen or make if follow a +2139 * path defined by an instance of <code>CAAT.Path</code>. +2140 * +2141 * @constructor +2142 * @extends CAAT.ActorContainer +2143 * +2144 */ +2145 CAAT.TextActor = function() { +2146 CAAT.TextActor.superclass.constructor.call(this); +2147 this.font= "10px sans-serif"; +2148 this.textAlign= "left"; +2149 this.textBaseline= "top"; +2150 this.outlineColor= "black"; +2151 this.clip= false; +2152 +2153 return this; +2154 }; +2155 +2156 CAAT.TextActor.TRAVERSE_PATH_FORWARD= 1; +2157 CAAT.TextActor.TRAVERSE_PATH_BACKWARD= -1; +2158 +2159 CAAT.TextActor.prototype= { +2160 font: null, // a valid canvas rendering context font description. Default font +2161 // will be "10px sans-serif". +2162 textAlign: null, // a valid canvas rendering context textAlign string. Any of: +2163 // start, end, left, right, center. +2164 // defaults to "left". +2165 textBaseline: null, // a valid canvas rendering context textBaseLine string. Any of: +2166 // top, hanging, middle, alphabetic, ideographic, bottom. +2167 // defaults to "top". +2168 fill: true, // a boolean indicating whether the text should be filled. +2169 text: null, // a string with the text to draw. +2170 textWidth: 0, // an integer indicating text width in pixels. +2171 textHeight: 0, // an integer indicating text height in pixels. +2172 outline: false, // a boolean indicating whether the text should be outlined. +2173 // not all browsers support it. +2174 outlineColor: null, // a valid color description string. +2175 +2176 path: null, // a CAAT.Path which will be traversed by the text. [Optional] +2177 pathInterpolator: null, // a CAAT.Interpolator to apply to the path traversing. +2178 pathDuration: 10000, // an integer indicating the time to be taken to traverse the path. ms. +2179 sign: 1, // traverse the path forward or backwards. +2180 +2181 /** +2182 * Set the text to be filled. The default Filling style will be set by calling setFillStyle method. +2183 * Default value is true. +2184 * @param fill {boolean} a boolean indicating whether the text will be filled. +2185 * @return this; +2186 */ +2187 setFill : function( fill ) { +2188 this.fill= fill; +2189 return this; +2190 }, +2191 /** +2192 * Sets whether the text will be outlined. +2193 * @param outline {boolean} a boolean indicating whether the text will be outlined. +2194 * @return this; +2195 */ +2196 setOutline : function( outline ) { +2197 this.outline= outline; +2198 return this; +2199 }, +2200 setPathTraverseDirection : function(direction) { +2201 this.sign= direction; +2202 return this; +2203 }, +2204 /** +2205 * Defines text's outline color. +2206 * +2207 * @param color {string} sets a valid canvas context color. +2208 * @return this. +2209 */ +2210 setOutlineColor : function( color ) { +2211 this.outlineColor= color; +2212 return this; +2213 }, +2214 /** +2215 * Set the text to be shown by the actor. +2216 * @param sText a string with the text to be shwon. +2217 * @return this +2218 */ +2219 setText : function( sText ) { +2220 this.text= sText; +2221 this.setFont( this.font ); +2222 +2223 return this; +2224 }, +2225 setTextAlign : function( align ) { +2226 this.textAlign= align; 2227 return this; -2228 -2229 }, -2230 setBaseline : function( baseline ) { -2231 return this.setTextBaseline(baseline); -2232 }, -2233 /** -2234 * Sets the font to be applied for the text. -2235 * @param font a string with a valid canvas rendering context font description. -2236 * @return this -2237 */ -2238 setFont : function(font) { -2239 -2240 if ( !font ) { -2241 return this; -2242 } -2243 -2244 this.font= font; -2245 -2246 if ( null===this.text || this.text==="" ) { -2247 this.width= this.height= 0; -2248 } -2249 -2250 return this; -2251 }, -2252 -2253 /** -2254 * Calculates the text dimension in pixels and stores the values in textWidth and textHeight -2255 * attributes. -2256 * If Actor's width and height were not set, the Actor's dimension will be set to these values. -2257 * @param director a CAAT.Director instance. -2258 * @return this -2259 */ -2260 calcTextSize : function(director) { +2228 }, +2229 /** +2230 * Sets text alignment +2231 * @param align +2232 * @deprecated use setTextAlign +2233 */ +2234 setAlign : function( align ) { +2235 return this.setTextAlign(align); +2236 }, +2237 /** +2238 * Set text baseline. +2239 * @param baseline +2240 */ +2241 setTextBaseline : function( baseline ) { +2242 this.textBaseline= baseline; +2243 return this; +2244 +2245 }, +2246 setBaseline : function( baseline ) { +2247 return this.setTextBaseline(baseline); +2248 }, +2249 /** +2250 * Sets the font to be applied for the text. +2251 * @param font a string with a valid canvas rendering context font description. +2252 * @return this +2253 */ +2254 setFont : function(font) { +2255 +2256 if ( !font ) { +2257 return this; +2258 } +2259 +2260 this.font= font; 2261 -2262 if ( director.glEnabled ) { -2263 return this; +2262 if ( null===this.text || this.text==="" ) { +2263 this.width= this.height= 0; 2264 } 2265 -2266 var ctx= director.ctx; -2267 -2268 director.ctx.save(); -2269 director.ctx.font= this.font; -2270 -2271 this.textWidth= director.crc.measureText( this.text ).width; -2272 if (this.width===0) { -2273 this.width= this.textWidth; -2274 } -2275 -2276 try { -2277 var pos= this.font.indexOf("px"); -2278 var s = this.font.substring(0, pos ); -2279 this.textHeight= parseInt(s,10); -2280 -2281 // needed to calculate the descent. -2282 // no context.getDescent(font) WTF !!! -2283 this.textHeight+= (this.textHeight/4)>>0; -2284 } catch(e) { -2285 this.textHeight=20; // default height; -2286 } -2287 -2288 if ( this.height===0 ) { -2289 this.height= this.textHeight; +2266 return this; +2267 }, +2268 +2269 /** +2270 * Calculates the text dimension in pixels and stores the values in textWidth and textHeight +2271 * attributes. +2272 * If Actor's width and height were not set, the Actor's dimension will be set to these values. +2273 * @param director a CAAT.Director instance. +2274 * @return this +2275 */ +2276 calcTextSize : function(director) { +2277 +2278 if ( director.glEnabled ) { +2279 return this; +2280 } +2281 +2282 var ctx= director.ctx; +2283 +2284 director.ctx.save(); +2285 director.ctx.font= this.font; +2286 +2287 this.textWidth= director.crc.measureText( this.text ).width; +2288 if (this.width===0) { +2289 this.width= this.textWidth; 2290 } 2291 -2292 director.crc.restore(); -2293 -2294 return this; -2295 }, -2296 /** -2297 * Custom paint method for TextActor instances. -2298 * If the path attribute is set, the text will be drawn traversing the path. -2299 * -2300 * @param director a valid CAAT.Director instance. -2301 * @param time an integer with the Scene time the Actor is being drawn. -2302 */ -2303 paint : function(director, time) { -2304 -2305 if ( this.backgroundImage ) { // cached -2306 CAAT.TextActor.superclass.paint.call(this, director, time ); -2307 } -2308 -2309 if ( null===this.text) { -2310 return; -2311 } -2312 -2313 if ( this.textWidth===0 || this.textHeight===0 ) { -2314 this.calcTextSize(director); -2315 } -2316 -2317 var canvas= director.crc; -2318 -2319 if( null!==this.font ) { -2320 canvas.font= this.font; -2321 } -2322 if ( null!==this.textAlign ) { -2323 canvas.textAlign= this.textAlign; -2324 } -2325 if ( null!==this.textBaseline ) { -2326 canvas.textBaseline= this.textBaseline; +2292 try { +2293 var pos= this.font.indexOf("px"); +2294 var s = this.font.substring(0, pos ); +2295 this.textHeight= parseInt(s,10); +2296 +2297 // needed to calculate the descent. +2298 // no context.getDescent(font) WTF !!! +2299 this.textHeight+= (this.textHeight/4)>>0; +2300 } catch(e) { +2301 this.textHeight=20; // default height; +2302 } +2303 +2304 if ( this.height===0 ) { +2305 this.height= this.textHeight; +2306 } +2307 +2308 director.crc.restore(); +2309 +2310 return this; +2311 }, +2312 /** +2313 * Custom paint method for TextActor instances. +2314 * If the path attribute is set, the text will be drawn traversing the path. +2315 * +2316 * @param director a valid CAAT.Director instance. +2317 * @param time an integer with the Scene time the Actor is being drawn. +2318 */ +2319 paint : function(director, time) { +2320 +2321 if ( this.backgroundImage ) { // cached +2322 CAAT.TextActor.superclass.paint.call(this, director, time ); +2323 } +2324 +2325 if ( null===this.text) { +2326 return; 2327 } -2328 if ( null!==this.fillStyle ) { -2329 canvas.fillStyle= this.fillStyle; -2330 } -2331 -2332 if (null===this.path) { -2333 -2334 var tx=0; -2335 if ( this.textAlign==='center') { -2336 tx= (this.width/2)|0; -2337 } else if ( this.textAlign==='right' ) { -2338 tx= this.width; -2339 } -2340 -2341 if ( this.fill ) { -2342 canvas.fillText( this.text, tx, 0 ); -2343 if ( this.outline ) { -2344 -2345 // firefox necesita beginPath, si no, dibujara ademas el cuadrado del -2346 // contenedor de los textos. -2347 if ( null!==this.outlineColor ) { -2348 canvas.strokeStyle= this.outlineColor; -2349 } -2350 canvas.beginPath(); -2351 canvas.strokeText( this.text, tx, 0 ); -2352 } -2353 } else { -2354 if ( null!==this.outlineColor ) { -2355 canvas.strokeStyle= this.outlineColor; -2356 } -2357 canvas.beginPath(); -2358 canvas.strokeText( this.text, tx, 0 ); -2359 } -2360 } -2361 else { -2362 this.drawOnPath(director,time); -2363 } -2364 }, -2365 /** -2366 * Private. -2367 * Draw the text traversing a path. -2368 * @param director a valid CAAT.Director instance. -2369 * @param time an integer with the Scene time the Actor is being drawn. -2370 */ -2371 drawOnPath : function(director, time) { -2372 -2373 var canvas= director.crc; -2374 -2375 var textWidth=this.sign * this.pathInterpolator.getPosition( -2376 (time%this.pathDuration)/this.pathDuration ).y * this.path.getLength() ; -2377 var p0= new CAAT.Point(0,0,0); -2378 var p1= new CAAT.Point(0,0,0); -2379 -2380 for( var i=0; i<this.text.length; i++ ) { -2381 var caracter= this.text[i].toString(); -2382 var charWidth= canvas.measureText( caracter ).width; -2383 -2384 var pathLength= this.path.getLength(); -2385 -2386 var currentCurveLength= charWidth/2 + textWidth; -2387 -2388 p0= this.path.getPositionFromLength(currentCurveLength).clone(); -2389 p1= this.path.getPositionFromLength(currentCurveLength-0.1).clone(); +2328 +2329 if ( this.textWidth===0 || this.textHeight===0 ) { +2330 this.calcTextSize(director); +2331 } +2332 +2333 var canvas= director.crc; +2334 +2335 if( null!==this.font ) { +2336 canvas.font= this.font; +2337 } +2338 if ( null!==this.textAlign ) { +2339 canvas.textAlign= this.textAlign; +2340 } +2341 if ( null!==this.textBaseline ) { +2342 canvas.textBaseline= this.textBaseline; +2343 } +2344 if ( null!==this.fillStyle ) { +2345 canvas.fillStyle= this.fillStyle; +2346 } +2347 +2348 if (null===this.path) { +2349 +2350 var tx=0; +2351 if ( this.textAlign==='center') { +2352 tx= (this.width/2)|0; +2353 } else if ( this.textAlign==='right' ) { +2354 tx= this.width; +2355 } +2356 +2357 if ( this.fill ) { +2358 canvas.fillText( this.text, tx, 0 ); +2359 if ( this.outline ) { +2360 +2361 // firefox necesita beginPath, si no, dibujara ademas el cuadrado del +2362 // contenedor de los textos. +2363 if ( null!==this.outlineColor ) { +2364 canvas.strokeStyle= this.outlineColor; +2365 } +2366 canvas.beginPath(); +2367 canvas.strokeText( this.text, tx, 0 ); +2368 } +2369 } else { +2370 if ( null!==this.outlineColor ) { +2371 canvas.strokeStyle= this.outlineColor; +2372 } +2373 canvas.beginPath(); +2374 canvas.strokeText( this.text, tx, 0 ); +2375 } +2376 } +2377 else { +2378 this.drawOnPath(director,time); +2379 } +2380 }, +2381 /** +2382 * Private. +2383 * Draw the text traversing a path. +2384 * @param director a valid CAAT.Director instance. +2385 * @param time an integer with the Scene time the Actor is being drawn. +2386 */ +2387 drawOnPath : function(director, time) { +2388 +2389 var canvas= director.crc; 2390 -2391 var angle= Math.atan2( p0.y-p1.y, p0.x-p1.x ); -2392 -2393 canvas.save(); -2394 -2395 canvas.translate( (0.5+p0.x)|0, (0.5+p0.y)|0 ); -2396 canvas.rotate( angle ); -2397 if ( this.fill ) { -2398 canvas.fillText(caracter,0,0); -2399 } -2400 if ( this.outline ) { -2401 canvas.strokeStyle= this.outlineColor; -2402 canvas.strokeText(caracter,0,0); -2403 } -2404 -2405 canvas.restore(); +2391 var textWidth=this.sign * this.pathInterpolator.getPosition( +2392 (time%this.pathDuration)/this.pathDuration ).y * this.path.getLength() ; +2393 var p0= new CAAT.Point(0,0,0); +2394 var p1= new CAAT.Point(0,0,0); +2395 +2396 for( var i=0; i<this.text.length; i++ ) { +2397 var caracter= this.text[i].toString(); +2398 var charWidth= canvas.measureText( caracter ).width; +2399 +2400 var pathLength= this.path.getLength(); +2401 +2402 var currentCurveLength= charWidth/2 + textWidth; +2403 +2404 p0= this.path.getPositionFromLength(currentCurveLength).clone(); +2405 p1= this.path.getPositionFromLength(currentCurveLength-0.1).clone(); 2406 -2407 textWidth+= charWidth; -2408 } -2409 }, -2410 /** -2411 * Set the path, interpolator and duration to draw the text on. -2412 * @param path a valid CAAT.Path instance. -2413 * @param interpolator a CAAT.Interpolator object. If not set, a Linear Interpolator will be used. -2414 * @param duration an integer indicating the time to take to traverse the path. Optional. 10000 ms -2415 * by default. -2416 */ -2417 setPath : function( path, interpolator, duration ) { -2418 this.path= path; -2419 this.pathInterpolator= interpolator || new CAAT.Interpolator().createLinearInterpolator(); -2420 this.pathDuration= duration || 10000; -2421 -2422 /* -2423 parent could not be set by the time this method is called. -2424 so the actors bounds set is removed. -2425 the developer must ensure to call setbounds properly on actor. -2426 */ -2427 this.mouseEnabled= false; -2428 -2429 return this; -2430 } -2431 }; -2432 -2433 extend( CAAT.TextActor, CAAT.ActorContainer, null); -2434 })(); -2435 -2436 (function() { +2407 var angle= Math.atan2( p0.y-p1.y, p0.x-p1.x ); +2408 +2409 canvas.save(); +2410 +2411 canvas.translate( (0.5+p0.x)|0, (0.5+p0.y)|0 ); +2412 canvas.rotate( angle ); +2413 if ( this.fill ) { +2414 canvas.fillText(caracter,0,0); +2415 } +2416 if ( this.outline ) { +2417 canvas.strokeStyle= this.outlineColor; +2418 canvas.strokeText(caracter,0,0); +2419 } +2420 +2421 canvas.restore(); +2422 +2423 textWidth+= charWidth; +2424 } +2425 }, +2426 /** +2427 * Set the path, interpolator and duration to draw the text on. +2428 * @param path a valid CAAT.Path instance. +2429 * @param interpolator a CAAT.Interpolator object. If not set, a Linear Interpolator will be used. +2430 * @param duration an integer indicating the time to take to traverse the path. Optional. 10000 ms +2431 * by default. +2432 */ +2433 setPath : function( path, interpolator, duration ) { +2434 this.path= path; +2435 this.pathInterpolator= interpolator || new CAAT.Interpolator().createLinearInterpolator(); +2436 this.pathDuration= duration || 10000; 2437 -2438 /** -2439 * This Actor draws common shapes, concretely Circles and rectangles. -2440 * -2441 * @constructor -2442 * @extends CAAT.ActorContainer -2443 */ -2444 CAAT.ShapeActor = function() { -2445 CAAT.ShapeActor.superclass.constructor.call(this); -2446 this.compositeOp= 'source-over'; -2447 -2448 /** -2449 * Thanks Svend Dutz and Thomas Karolski for noticing this call was not performed by default, -2450 * so if no explicit call to setShape was made, nothing would be drawn. -2451 */ -2452 this.setShape( this.SHAPE_CIRCLE ); -2453 return this; -2454 }; -2455 -2456 CAAT.ShapeActor.prototype= { -2457 -2458 shape: 0, // shape type. One of the constant SHAPE_* values -2459 compositeOp: null, // a valid canvas rendering context string describing compositeOps. -2460 lineWidth: 1, -2461 lineCap: null, -2462 lineJoin: null, -2463 miterLimit: null, -2464 -2465 SHAPE_CIRCLE: 0, // Constants to describe different shapes. -2466 SHAPE_RECTANGLE:1, -2467 -2468 /** -2469 * -2470 * @param l {number>0} -2471 */ -2472 setLineWidth : function(l) { -2473 this.lineWidth= l; -2474 return this; -2475 }, -2476 /** -2477 * -2478 * @param lc {string{butt|round|square}} -2479 */ -2480 setLineCap : function(lc) { -2481 this.lineCap= lc; -2482 return this; -2483 }, +2438 /* +2439 parent could not be set by the time this method is called. +2440 so the actors bounds set is removed. +2441 the developer must ensure to call setbounds properly on actor. +2442 */ +2443 this.mouseEnabled= false; +2444 +2445 return this; +2446 } +2447 }; +2448 +2449 extend( CAAT.TextActor, CAAT.ActorContainer, null); +2450 })(); +2451 +2452 (function() { +2453 +2454 /** +2455 * This Actor draws common shapes, concretely Circles and rectangles. +2456 * +2457 * @constructor +2458 * @extends CAAT.ActorContainer +2459 */ +2460 CAAT.ShapeActor = function() { +2461 CAAT.ShapeActor.superclass.constructor.call(this); +2462 this.compositeOp= 'source-over'; +2463 +2464 /** +2465 * Thanks Svend Dutz and Thomas Karolski for noticing this call was not performed by default, +2466 * so if no explicit call to setShape was made, nothing would be drawn. +2467 */ +2468 this.setShape( this.SHAPE_CIRCLE ); +2469 return this; +2470 }; +2471 +2472 CAAT.ShapeActor.prototype= { +2473 +2474 shape: 0, // shape type. One of the constant SHAPE_* values +2475 compositeOp: null, // a valid canvas rendering context string describing compositeOps. +2476 lineWidth: 1, +2477 lineCap: null, +2478 lineJoin: null, +2479 miterLimit: null, +2480 +2481 SHAPE_CIRCLE: 0, // Constants to describe different shapes. +2482 SHAPE_RECTANGLE:1, +2483 2484 /** -2485 * -2486 * @param lj {string{bevel|round|miter}} +2485 * +2486 * @param l {number>0} 2487 */ -2488 setLineJoin : function(lj) { -2489 this.lineJoin= lj; +2488 setLineWidth : function(l) { +2489 this.lineWidth= l; 2490 return this; 2491 }, 2492 /** 2493 * -2494 * @param ml {integer>0} +2494 * @param lc {string{butt|round|square}} 2495 */ -2496 setMiterLimit : function(ml) { -2497 this.miterLimit= ml; +2496 setLineCap : function(lc) { +2497 this.lineCap= lc; 2498 return this; 2499 }, -2500 getLineCap : function() { -2501 return this.lineCap; -2502 }, -2503 getLineJoin : function() { -2504 return this.lineJoin; -2505 }, -2506 getMiterLimit : function() { -2507 return this.miterLimit; -2508 }, -2509 getLineWidth : function() { -2510 return this.lineWidth; -2511 }, -2512 /** -2513 * Sets shape type. -2514 * No check for parameter validity is performed. -2515 * Set paint method according to the shape. -2516 * @param iShape an integer with any of the SHAPE_* constants. -2517 * @return this -2518 */ -2519 setShape : function(iShape) { -2520 this.shape= iShape; -2521 this.paint= this.shape===this.SHAPE_CIRCLE ? -2522 this.paintCircle : -2523 this.paintRectangle; -2524 return this; -2525 }, -2526 /** -2527 * Sets the composite operation to apply on shape drawing. -2528 * @param compositeOp an string with a valid canvas rendering context string describing compositeOps. -2529 * @return this -2530 */ -2531 setCompositeOp : function(compositeOp){ -2532 this.compositeOp= compositeOp; -2533 return this; -2534 }, -2535 /** -2536 * Draws the shape. -2537 * Applies the values of fillStype, strokeStyle, compositeOp, etc. -2538 * -2539 * @param director a valid CAAT.Director instance. -2540 * @param time an integer with the Scene time the Actor is being drawn. -2541 */ -2542 paint : function(director,time) { -2543 }, -2544 /** -2545 * @private -2546 * Draws a circle. -2547 * @param director a valid CAAT.Director instance. -2548 * @param time an integer with the Scene time the Actor is being drawn. -2549 */ -2550 paintCircle : function(director,time) { -2551 var ctx= director.crc; -2552 -2553 ctx.lineWidth= this.lineWidth; -2554 -2555 ctx.globalCompositeOperation= this.compositeOp; -2556 if ( null!==this.fillStyle ) { -2557 ctx.fillStyle= this.fillStyle; -2558 ctx.beginPath(); -2559 ctx.arc( this.width/2, this.height/2, Math.min(this.width,this.height)/2, 0, 2*Math.PI, false ); -2560 ctx.fill(); -2561 } -2562 -2563 if ( null!==this.strokeStyle ) { -2564 ctx.strokeStyle= this.strokeStyle; -2565 ctx.beginPath(); -2566 ctx.arc( this.width/2, this.height/2, Math.min(this.width,this.height)/2, 0, 2*Math.PI, false ); -2567 ctx.stroke(); -2568 } -2569 }, -2570 /** -2571 * -2572 * Private -2573 * Draws a Rectangle. -2574 * -2575 * @param director a valid CAAT.Director instance. -2576 * @param time an integer with the Scene time the Actor is being drawn. -2577 */ -2578 paintRectangle : function(director,time) { -2579 var ctx= director.crc; -2580 -2581 ctx.lineWidth= this.lineWidth; -2582 -2583 if ( this.lineCap ) { -2584 ctx.lineCap= this.lineCap; -2585 } -2586 if ( this.lineJoin ) { -2587 ctx.lineJoin= this.lineJoin; -2588 } -2589 if ( this.miterLimit ) { -2590 ctx.miterLimit= this.miterLimit; -2591 } -2592 -2593 ctx.globalCompositeOperation= this.compositeOp; -2594 if ( null!==this.fillStyle ) { -2595 ctx.fillStyle= this.fillStyle; -2596 ctx.beginPath(); -2597 ctx.fillRect(0,0,this.width,this.height); -2598 ctx.fill(); -2599 } -2600 -2601 if ( null!==this.strokeStyle ) { -2602 ctx.strokeStyle= this.strokeStyle; -2603 ctx.beginPath(); -2604 ctx.strokeRect(0,0,this.width,this.height); -2605 ctx.stroke(); -2606 } -2607 } -2608 }; -2609 -2610 extend( CAAT.ShapeActor, CAAT.ActorContainer, null); -2611 })(); -2612 -2613 (function() { -2614 -2615 /** -2616 * This actor draws stars. -2617 * -2618 * @constructor -2619 * @extends CAAT.ActorContainer -2620 */ -2621 CAAT.StarActor= function() { -2622 CAAT.StarActor.superclass.constructor.call(this); -2623 this.compositeOp= 'source-over'; -2624 return this; -2625 }; -2626 -2627 CAAT.StarActor.prototype= { -2628 nPeaks: 0, -2629 maxRadius: 0, -2630 minRadius: 0, -2631 initialAngle: 0, -2632 compositeOp: null, -2633 lineWidth: 1, -2634 lineCap: null, -2635 lineJoin: null, -2636 miterLimit: null, -2637 -2638 /** -2639 * -2640 * @param l {number>0} -2641 */ -2642 setLineWidth : function(l) { -2643 this.lineWidth= l; -2644 return this; -2645 }, -2646 /** -2647 * -2648 * @param lc {string{butt|round|square}} -2649 */ -2650 setLineCap : function(lc) { -2651 this.lineCap= lc; -2652 return this; -2653 }, +2500 /** +2501 * +2502 * @param lj {string{bevel|round|miter}} +2503 */ +2504 setLineJoin : function(lj) { +2505 this.lineJoin= lj; +2506 return this; +2507 }, +2508 /** +2509 * +2510 * @param ml {integer>0} +2511 */ +2512 setMiterLimit : function(ml) { +2513 this.miterLimit= ml; +2514 return this; +2515 }, +2516 getLineCap : function() { +2517 return this.lineCap; +2518 }, +2519 getLineJoin : function() { +2520 return this.lineJoin; +2521 }, +2522 getMiterLimit : function() { +2523 return this.miterLimit; +2524 }, +2525 getLineWidth : function() { +2526 return this.lineWidth; +2527 }, +2528 /** +2529 * Sets shape type. +2530 * No check for parameter validity is performed. +2531 * Set paint method according to the shape. +2532 * @param iShape an integer with any of the SHAPE_* constants. +2533 * @return this +2534 */ +2535 setShape : function(iShape) { +2536 this.shape= iShape; +2537 this.paint= this.shape===this.SHAPE_CIRCLE ? +2538 this.paintCircle : +2539 this.paintRectangle; +2540 return this; +2541 }, +2542 /** +2543 * Sets the composite operation to apply on shape drawing. +2544 * @param compositeOp an string with a valid canvas rendering context string describing compositeOps. +2545 * @return this +2546 */ +2547 setCompositeOp : function(compositeOp){ +2548 this.compositeOp= compositeOp; +2549 return this; +2550 }, +2551 /** +2552 * Draws the shape. +2553 * Applies the values of fillStype, strokeStyle, compositeOp, etc. +2554 * +2555 * @param director a valid CAAT.Director instance. +2556 * @param time an integer with the Scene time the Actor is being drawn. +2557 */ +2558 paint : function(director,time) { +2559 }, +2560 /** +2561 * @private +2562 * Draws a circle. +2563 * @param director a valid CAAT.Director instance. +2564 * @param time an integer with the Scene time the Actor is being drawn. +2565 */ +2566 paintCircle : function(director,time) { +2567 var ctx= director.crc; +2568 +2569 ctx.lineWidth= this.lineWidth; +2570 +2571 ctx.globalCompositeOperation= this.compositeOp; +2572 if ( null!==this.fillStyle ) { +2573 ctx.fillStyle= this.fillStyle; +2574 ctx.beginPath(); +2575 ctx.arc( this.width/2, this.height/2, Math.min(this.width,this.height)/2, 0, 2*Math.PI, false ); +2576 ctx.fill(); +2577 } +2578 +2579 if ( null!==this.strokeStyle ) { +2580 ctx.strokeStyle= this.strokeStyle; +2581 ctx.beginPath(); +2582 ctx.arc( this.width/2, this.height/2, Math.min(this.width,this.height)/2, 0, 2*Math.PI, false ); +2583 ctx.stroke(); +2584 } +2585 }, +2586 /** +2587 * +2588 * Private +2589 * Draws a Rectangle. +2590 * +2591 * @param director a valid CAAT.Director instance. +2592 * @param time an integer with the Scene time the Actor is being drawn. +2593 */ +2594 paintRectangle : function(director,time) { +2595 var ctx= director.crc; +2596 +2597 ctx.lineWidth= this.lineWidth; +2598 +2599 if ( this.lineCap ) { +2600 ctx.lineCap= this.lineCap; +2601 } +2602 if ( this.lineJoin ) { +2603 ctx.lineJoin= this.lineJoin; +2604 } +2605 if ( this.miterLimit ) { +2606 ctx.miterLimit= this.miterLimit; +2607 } +2608 +2609 ctx.globalCompositeOperation= this.compositeOp; +2610 if ( null!==this.fillStyle ) { +2611 ctx.fillStyle= this.fillStyle; +2612 ctx.beginPath(); +2613 ctx.fillRect(0,0,this.width,this.height); +2614 ctx.fill(); +2615 } +2616 +2617 if ( null!==this.strokeStyle ) { +2618 ctx.strokeStyle= this.strokeStyle; +2619 ctx.beginPath(); +2620 ctx.strokeRect(0,0,this.width,this.height); +2621 ctx.stroke(); +2622 } +2623 } +2624 }; +2625 +2626 extend( CAAT.ShapeActor, CAAT.ActorContainer, null); +2627 })(); +2628 +2629 (function() { +2630 +2631 /** +2632 * This actor draws stars. +2633 * +2634 * @constructor +2635 * @extends CAAT.ActorContainer +2636 */ +2637 CAAT.StarActor= function() { +2638 CAAT.StarActor.superclass.constructor.call(this); +2639 this.compositeOp= 'source-over'; +2640 return this; +2641 }; +2642 +2643 CAAT.StarActor.prototype= { +2644 nPeaks: 0, +2645 maxRadius: 0, +2646 minRadius: 0, +2647 initialAngle: 0, +2648 compositeOp: null, +2649 lineWidth: 1, +2650 lineCap: null, +2651 lineJoin: null, +2652 miterLimit: null, +2653 2654 /** 2655 * -2656 * @param lj {string{bevel|round|miter}} +2656 * @param l {number>0} 2657 */ -2658 setLineJoin : function(lj) { -2659 this.lineJoin= lj; +2658 setLineWidth : function(l) { +2659 this.lineWidth= l; 2660 return this; 2661 }, 2662 /** 2663 * -2664 * @param ml {integer>0} +2664 * @param lc {string{butt|round|square}} 2665 */ -2666 setMiterLimit : function(ml) { -2667 this.miterLimit= ml; +2666 setLineCap : function(lc) { +2667 this.lineCap= lc; 2668 return this; 2669 }, -2670 getLineCap : function() { -2671 return this.lineCap; -2672 }, -2673 getLineJoin : function() { -2674 return this.lineJoin; -2675 }, -2676 getMiterLimit : function() { -2677 return this.miterLimit; -2678 }, -2679 getLineWidth : function() { -2680 return this.lineWidth; -2681 }, -2682 /** -2683 * Sets whether the star will be color filled. -2684 * @param filled {boolean} -2685 * @deprecated -2686 */ -2687 setFilled : function( filled ) { -2688 return this; -2689 }, -2690 /** -2691 * Sets whether the star will be outlined. -2692 * @param outlined {boolean} -2693 * @deprecated -2694 */ -2695 setOutlined : function( outlined ) { -2696 return this; +2670 /** +2671 * +2672 * @param lj {string{bevel|round|miter}} +2673 */ +2674 setLineJoin : function(lj) { +2675 this.lineJoin= lj; +2676 return this; +2677 }, +2678 /** +2679 * +2680 * @param ml {integer>0} +2681 */ +2682 setMiterLimit : function(ml) { +2683 this.miterLimit= ml; +2684 return this; +2685 }, +2686 getLineCap : function() { +2687 return this.lineCap; +2688 }, +2689 getLineJoin : function() { +2690 return this.lineJoin; +2691 }, +2692 getMiterLimit : function() { +2693 return this.miterLimit; +2694 }, +2695 getLineWidth : function() { +2696 return this.lineWidth; 2697 }, 2698 /** -2699 * Sets the composite operation to apply on shape drawing. -2700 * @param compositeOp an string with a valid canvas rendering context string describing compositeOps. -2701 * @return this +2699 * Sets whether the star will be color filled. +2700 * @param filled {boolean} +2701 * @deprecated 2702 */ -2703 setCompositeOp : function(compositeOp){ -2704 this.compositeOp= compositeOp; -2705 return this; -2706 }, -2707 /** -2708 * -2709 * @param angle {number} number in radians. +2703 setFilled : function( filled ) { +2704 return this; +2705 }, +2706 /** +2707 * Sets whether the star will be outlined. +2708 * @param outlined {boolean} +2709 * @deprecated 2710 */ -2711 setInitialAngle : function(angle) { -2712 this.initialAngle= angle; -2713 return this; -2714 }, -2715 /** -2716 * Initialize the star values. -2717 * <p> -2718 * The star actor will be of size 2*maxRadius. -2719 * -2720 * @param nPeaks {number} number of star points. -2721 * @param maxRadius {number} maximum star radius -2722 * @param minRadius {number} minimum star radius -2723 * -2724 * @return this -2725 */ -2726 initialize : function(nPeaks, maxRadius, minRadius) { -2727 this.setSize( 2*maxRadius, 2*maxRadius ); -2728 -2729 this.nPeaks= nPeaks; -2730 this.maxRadius= maxRadius; -2731 this.minRadius= minRadius; -2732 -2733 return this; -2734 }, -2735 /** -2736 * Paint the star. -2737 * -2738 * @param director {CAAT.Director} -2739 * @param timer {number} -2740 */ -2741 paint : function(director, timer) { -2742 -2743 var ctx= director.ctx; -2744 var centerX= this.width/2; -2745 var centerY= this.height/2; -2746 var r1= this.maxRadius; -2747 var r2= this.minRadius; -2748 var ix= centerX + r1*Math.cos(this.initialAngle); -2749 var iy= centerY + r1*Math.sin(this.initialAngle); -2750 -2751 ctx.lineWidth= this.lineWidth; -2752 if ( this.lineCap ) { -2753 ctx.lineCap= this.lineCap; -2754 } -2755 if ( this.lineJoin ) { -2756 ctx.lineJoin= this.lineJoin; -2757 } -2758 if ( this.miterLimit ) { -2759 ctx.miterLimit= this.miterLimit; -2760 } -2761 -2762 ctx.globalCompositeOperation= this.compositeOp; -2763 -2764 ctx.beginPath(); -2765 ctx.moveTo(ix,iy); +2711 setOutlined : function( outlined ) { +2712 return this; +2713 }, +2714 /** +2715 * Sets the composite operation to apply on shape drawing. +2716 * @param compositeOp an string with a valid canvas rendering context string describing compositeOps. +2717 * @return this +2718 */ +2719 setCompositeOp : function(compositeOp){ +2720 this.compositeOp= compositeOp; +2721 return this; +2722 }, +2723 /** +2724 * +2725 * @param angle {number} number in radians. +2726 */ +2727 setInitialAngle : function(angle) { +2728 this.initialAngle= angle; +2729 return this; +2730 }, +2731 /** +2732 * Initialize the star values. +2733 * <p> +2734 * The star actor will be of size 2*maxRadius. +2735 * +2736 * @param nPeaks {number} number of star points. +2737 * @param maxRadius {number} maximum star radius +2738 * @param minRadius {number} minimum star radius +2739 * +2740 * @return this +2741 */ +2742 initialize : function(nPeaks, maxRadius, minRadius) { +2743 this.setSize( 2*maxRadius, 2*maxRadius ); +2744 +2745 this.nPeaks= nPeaks; +2746 this.maxRadius= maxRadius; +2747 this.minRadius= minRadius; +2748 +2749 return this; +2750 }, +2751 /** +2752 * Paint the star. +2753 * +2754 * @param director {CAAT.Director} +2755 * @param timer {number} +2756 */ +2757 paint : function(director, timer) { +2758 +2759 var ctx= director.ctx; +2760 var centerX= this.width/2; +2761 var centerY= this.height/2; +2762 var r1= this.maxRadius; +2763 var r2= this.minRadius; +2764 var ix= centerX + r1*Math.cos(this.initialAngle); +2765 var iy= centerY + r1*Math.sin(this.initialAngle); 2766 -2767 for( var i=1; i<this.nPeaks*2; i++ ) { -2768 var angleStar= Math.PI/this.nPeaks * i + this.initialAngle; -2769 var rr= (i%2===0) ? r1 : r2; -2770 var x= centerX + rr*Math.cos(angleStar); -2771 var y= centerY + rr*Math.sin(angleStar); -2772 ctx.lineTo(x,y); +2767 ctx.lineWidth= this.lineWidth; +2768 if ( this.lineCap ) { +2769 ctx.lineCap= this.lineCap; +2770 } +2771 if ( this.lineJoin ) { +2772 ctx.lineJoin= this.lineJoin; 2773 } -2774 -2775 ctx.lineTo( -2776 centerX + r1*Math.cos(this.initialAngle), -2777 centerY + r1*Math.sin(this.initialAngle) ); -2778 -2779 ctx.closePath(); -2780 -2781 if ( this.fillStyle ) { -2782 ctx.fillStyle= this.fillStyle; -2783 ctx.fill(); -2784 } -2785 -2786 if ( this.strokeStyle ) { -2787 ctx.strokeStyle= this.strokeStyle; -2788 ctx.stroke(); +2774 if ( this.miterLimit ) { +2775 ctx.miterLimit= this.miterLimit; +2776 } +2777 +2778 ctx.globalCompositeOperation= this.compositeOp; +2779 +2780 ctx.beginPath(); +2781 ctx.moveTo(ix,iy); +2782 +2783 for( var i=1; i<this.nPeaks*2; i++ ) { +2784 var angleStar= Math.PI/this.nPeaks * i + this.initialAngle; +2785 var rr= (i%2===0) ? r1 : r2; +2786 var x= centerX + rr*Math.cos(angleStar); +2787 var y= centerY + rr*Math.sin(angleStar); +2788 ctx.lineTo(x,y); 2789 } 2790 -2791 } -2792 }; -2793 -2794 extend(CAAT.StarActor, CAAT.ActorContainer, null); -2795 -2796 })(); -2797 -2798 /** -2799 * An actor suitable to draw an ImageProcessor instance. -2800 */ -2801 (function() { -2802 -2803 /** -2804 * This Actor will show the result of an image processing operation. -2805 * -2806 * @constructor -2807 * @extends CAAT.ActorContainer -2808 */ -2809 CAAT.IMActor= function() { -2810 CAAT.IMActor.superclass.constructor.call(this); -2811 return this; -2812 }; +2791 ctx.lineTo( +2792 centerX + r1*Math.cos(this.initialAngle), +2793 centerY + r1*Math.sin(this.initialAngle) ); +2794 +2795 ctx.closePath(); +2796 +2797 if ( this.fillStyle ) { +2798 ctx.fillStyle= this.fillStyle; +2799 ctx.fill(); +2800 } +2801 +2802 if ( this.strokeStyle ) { +2803 ctx.strokeStyle= this.strokeStyle; +2804 ctx.stroke(); +2805 } +2806 +2807 } +2808 }; +2809 +2810 extend(CAAT.StarActor, CAAT.ActorContainer, null); +2811 +2812 })(); 2813 -2814 CAAT.IMActor.prototype= { -2815 -2816 imageProcessor: null, -2817 changeTime: 100, -2818 lastApplicationTime: -1, -2819 -2820 /** -2821 * Set the image processor. -2822 * -2823 * @param im {CAAT.ImageProcessor} a CAAT.ImageProcessor instance. -2824 */ -2825 setImageProcessor : function(im) { -2826 this.imageProcessor= im; -2827 return this; -2828 }, -2829 /** -2830 * Call image processor to update image every time milliseconds. -2831 * @param time an integer indicating milliseconds to elapse before updating the frame. -2832 */ -2833 setImageProcessingTime : function( time ) { -2834 this.changeTime= time; -2835 return this; -2836 }, -2837 paint : function( director, time ) { -2838 if ( time-this.lastApplicationTime>this.changeTime ) { -2839 this.imageProcessor.apply( director, time ); -2840 this.lastApplicationTime= time; -2841 } -2842 -2843 var ctx= director.ctx; -2844 this.imageProcessor.paint( director, time ); -2845 } -2846 }; -2847 -2848 extend( CAAT.IMActor, CAAT.ActorContainer, null); -2849 })(); \ No newline at end of file +2814 /** +2815 * An actor suitable to draw an ImageProcessor instance. +2816 */ +2817 (function() { +2818 +2819 /** +2820 * This Actor will show the result of an image processing operation. +2821 * +2822 * @constructor +2823 * @extends CAAT.ActorContainer +2824 */ +2825 CAAT.IMActor= function() { +2826 CAAT.IMActor.superclass.constructor.call(this); +2827 return this; +2828 }; +2829 +2830 CAAT.IMActor.prototype= { +2831 +2832 imageProcessor: null, +2833 changeTime: 100, +2834 lastApplicationTime: -1, +2835 +2836 /** +2837 * Set the image processor. +2838 * +2839 * @param im {CAAT.ImageProcessor} a CAAT.ImageProcessor instance. +2840 */ +2841 setImageProcessor : function(im) { +2842 this.imageProcessor= im; +2843 return this; +2844 }, +2845 /** +2846 * Call image processor to update image every time milliseconds. +2847 * @param time an integer indicating milliseconds to elapse before updating the frame. +2848 */ +2849 setImageProcessingTime : function( time ) { +2850 this.changeTime= time; +2851 return this; +2852 }, +2853 paint : function( director, time ) { +2854 if ( time-this.lastApplicationTime>this.changeTime ) { +2855 this.imageProcessor.apply( director, time ); +2856 this.lastApplicationTime= time; +2857 } +2858 +2859 var ctx= director.ctx; +2860 this.imageProcessor.paint( director, time ); +2861 } +2862 }; +2863 +2864 extend( CAAT.IMActor, CAAT.ActorContainer, null); +2865 })(); \ No newline at end of file diff --git a/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_model_director.js.html b/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_model_director.js.html index 3b14fe6d..ab021380 100644 --- a/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_model_director.js.html +++ b/documentation/jsdoc/symbols/src/_Users_ibon_js_CAAT_src_model_director.js.html @@ -50,1854 +50,1974 @@ 43 this.lastSelectedActor = null; 44 this.dragging = false; 45 - 46 return this; - 47 }; - 48 - 49 - 50 - 51 CAAT.Director.prototype = { + 46 this.cDirtyRects= []; + 47 this.dirtyRects= []; + 48 for( var i=0; i<64; i++ ) { + 49 this.dirtyRects.push( new CAAT.Rectangle() ); + 50 } + 51 this.dirtyRectsIndex= 0; 52 - 53 debug: false, // flag indicating debug mode. It will draw affedted screen areas. - 54 - 55 onRenderStart: null, - 56 onRenderEnd: null, - 57 - 58 // input related attributes - 59 mousePoint: null, // mouse coordinate related to canvas 0,0 coord. - 60 prevMousePoint: null, // previous mouse position cache. Needed for drag events. - 61 screenMousePoint: null, // screen mouse coordinates. - 62 isMouseDown: false, // is the left mouse button pressed ? - 63 lastSelectedActor: null, // director's last actor receiving input. - 64 dragging: false, // is in drag mode ? - 65 - 66 // other attributes + 53 return this; + 54 }; + 55 + 56 + 57 CAAT.Director.CLEAR_DIRTY_RECTS= 1; + 58 CAAT.Director.CLEAR_ALL= true; + 59 CAAT.Director.CLEAR_NONE= false; + 60 + 61 CAAT.Director.prototype = { + 62 + 63 debug: false, // flag indicating debug mode. It will draw affedted screen areas. + 64 + 65 onRenderStart: null, + 66 onRenderEnd: null, 67 - 68 scenes: null, // Scenes collection. An array. - 69 currentScene: null, // The current Scene. This and only this will receive events. - 70 canvas: null, // The canvas the Director draws on. - 71 crc: null, // @deprecated. canvas rendering context - 72 ctx: null, // refactoring crc for a more convenient name - 73 time: 0, // virtual actor time. - 74 timeline: 0, // global director timeline. - 75 imagesCache: null, // An array of JSON elements of the form { id:string, image:Image } - 76 audioManager: null, - 77 clear: true, // clear background before drawing scenes ?? - 78 - 79 transitionScene: null, - 80 - 81 browserInfo: null, - 82 - 83 gl: null, - 84 glEnabled: false, - 85 glTextureManager: null, - 86 glTtextureProgram: null, - 87 glColorProgram: null, + 68 // input related attributes + 69 mousePoint: null, // mouse coordinate related to canvas 0,0 coord. + 70 prevMousePoint: null, // previous mouse position cache. Needed for drag events. + 71 screenMousePoint: null, // screen mouse coordinates. + 72 isMouseDown: false, // is the left mouse button pressed ? + 73 lastSelectedActor: null, // director's last actor receiving input. + 74 dragging: false, // is in drag mode ? + 75 + 76 // other attributes + 77 + 78 scenes: null, // Scenes collection. An array. + 79 currentScene: null, // The current Scene. This and only this will receive events. + 80 canvas: null, // The canvas the Director draws on. + 81 crc: null, // @deprecated. canvas rendering context + 82 ctx: null, // refactoring crc for a more convenient name + 83 time: 0, // virtual actor time. + 84 timeline: 0, // global director timeline. + 85 imagesCache: null, // An array of JSON elements of the form { id:string, image:Image } + 86 audioManager: null, + 87 clear: true, // clear background before drawing scenes ?? 88 - 89 pMatrix: null, // projection matrix - 90 coords: null, // Float32Array - 91 coordsIndex: 0, - 92 uv: null, - 93 uvIndex: 0, - 94 - 95 front_to_back: false, - 96 - 97 statistics: { - 98 size_total: 0, - 99 size_active: 0, -100 draws: 0 -101 }, -102 currentTexturePage: 0, -103 currentOpacity: 1, + 89 transitionScene: null, + 90 + 91 browserInfo: null, + 92 + 93 gl: null, + 94 glEnabled: false, + 95 glTextureManager: null, + 96 glTtextureProgram: null, + 97 glColorProgram: null, + 98 + 99 pMatrix: null, // projection matrix +100 coords: null, // Float32Array +101 coordsIndex: 0, +102 uv: null, +103 uvIndex: 0, 104 -105 intervalId: null, +105 front_to_back: false, 106 -107 frameCounter: 0, -108 -109 RESIZE_NONE: 1, -110 RESIZE_WIDTH: 2, -111 RESIZE_HEIGHT: 4, -112 RESIZE_BOTH: 8, -113 RESIZE_PROPORTIONAL:16, -114 resize: 1, -115 onResizeCallback: null, +107 statistics: { +108 size_total: 0, +109 size_active: 0, +110 draws: 0 +111 }, +112 currentTexturePage: 0, +113 currentOpacity: 1, +114 +115 intervalId: null, 116 -117 __gestureScale : 0, -118 __gestureRotation : 0, -119 -120 checkDebug : function() { -121 if ( CAAT.DEBUG ) { -122 var dd= new CAAT.Debug().initialize( this.width, 60 ); -123 this.debugInfo= dd.debugInfo.bind(dd); -124 } -125 }, -126 getRenderType : function() { -127 return this.glEnabled ? 'WEBGL' : 'CANVAS'; -128 }, -129 windowResized : function(w, h) { -130 switch (this.resize) { -131 case this.RESIZE_WIDTH: -132 this.setBounds(0, 0, w, this.height); -133 break; -134 case this.RESIZE_HEIGHT: -135 this.setBounds(0, 0, this.width, h); -136 break; -137 case this.RESIZE_BOTH: -138 this.setBounds(0, 0, w, h); -139 break; -140 case this.RESIZE_PROPORTIONAL: -141 this.setScaleProportional(w,h); -142 break; -143 } -144 -145 if ( this.glEnabled ) { -146 this.glReset(); -147 } -148 -149 if ( this.onResizeCallback ) { -150 this.onResizeCallback( this, w, h ); -151 } -152 -153 }, -154 setScaleProportional : function(w,h) { -155 -156 var factor= Math.min(w/this.referenceWidth, h/this.referenceHeight); -157 -158 this.setScaleAnchored( factor, factor, 0, 0 ); +117 frameCounter: 0, +118 +119 RESIZE_NONE: 1, +120 RESIZE_WIDTH: 2, +121 RESIZE_HEIGHT: 4, +122 RESIZE_BOTH: 8, +123 RESIZE_PROPORTIONAL:16, +124 resize: 1, +125 onResizeCallback : null, +126 +127 __gestureScale : 0, +128 __gestureRotation : 0, +129 +130 dirtyRects : null, +131 cDirtyRects : null, +132 dirtyRectsIndex : 0, +133 dirtyRectsEnabled : false, +134 +135 checkDebug : function() { +136 if ( CAAT.DEBUG ) { +137 var dd= new CAAT.Debug().initialize( this.width, 60 ); +138 this.debugInfo= dd.debugInfo.bind(dd); +139 } +140 }, +141 getRenderType : function() { +142 return this.glEnabled ? 'WEBGL' : 'CANVAS'; +143 }, +144 windowResized : function(w, h) { +145 switch (this.resize) { +146 case this.RESIZE_WIDTH: +147 this.setBounds(0, 0, w, this.height); +148 break; +149 case this.RESIZE_HEIGHT: +150 this.setBounds(0, 0, this.width, h); +151 break; +152 case this.RESIZE_BOTH: +153 this.setBounds(0, 0, w, h); +154 break; +155 case this.RESIZE_PROPORTIONAL: +156 this.setScaleProportional(w,h); +157 break; +158 } 159 -160 this.canvas.width = this.referenceWidth*factor; -161 this.canvas.height = this.referenceHeight*factor; -162 this.ctx = this.canvas.getContext(this.glEnabled ? 'experimental-webgl' : '2d' ); -163 this.crc = this.ctx; -164 -165 if ( this.glEnabled ) { -166 this.glReset(); -167 } +160 if ( this.glEnabled ) { +161 this.glReset(); +162 } +163 +164 if ( this.onResizeCallback ) { +165 this.onResizeCallback( this, w, h ); +166 } +167 168 }, -169 /** -170 * Enable window resize events and set redimension policy. A callback functio could be supplied -171 * to be notified on a Director redimension event. This is necessary in the case you set a redim -172 * policy not equal to RESIZE_PROPORTIONAL. In those redimension modes, director's area and their -173 * children scenes are resized to fit the new area. But scenes content is not resized, and have -174 * no option of knowing so uless an onResizeCallback function is supplied. -175 * -176 * @param mode {number} RESIZE_BOTH, RESIZE_WIDTH, RESIZE_HEIGHT, RESIZE_NONE. -177 * @param onResizeCallback {function(director{CAAT.Director}, width{integer}, height{integer})} a callback -178 * to notify on canvas resize. -179 */ -180 enableResizeEvents : function(mode, onResizeCallback) { -181 if (mode === this.RESIZE_BOTH || mode === this.RESIZE_WIDTH || mode === this.RESIZE_HEIGHT || mode===this.RESIZE_PROPORTIONAL) { -182 this.referenceWidth= this.width; -183 this.referenceHeight=this.height; -184 this.resize = mode; -185 CAAT.registerResizeListener(this); -186 this.onResizeCallback= onResizeCallback; -187 this.windowResized( window.innerWidth, window.innerHeight ); -188 } else { -189 CAAT.unregisterResizeListener(this); -190 this.onResizeCallback= null; -191 } -192 }, -193 /** -194 * Set this director's bounds as well as its contained scenes. -195 * @param x {number} ignored, will be 0. -196 * @param y {number} ignored, will be 0. -197 * @param w {number} director width. -198 * @param h {number} director height. -199 * -200 * @return this -201 */ -202 setBounds : function(x, y, w, h) { -203 CAAT.Director.superclass.setBounds.call(this, x, y, w, h); -204 -205 this.canvas.width = w; -206 this.canvas.height = h; -207 this.ctx = this.canvas.getContext(this.glEnabled ? 'experimental-webgl' : '2d'); -208 this.crc = this.ctx; -209 -210 for (var i = 0; i < this.scenes.length; i++) { -211 this.scenes[i].setBounds(0, 0, w, h); -212 } -213 -214 if ( this.glEnabled ) { -215 this.glReset(); -216 } -217 -218 return this; -219 }, -220 /** -221 * This method performs Director initialization. Must be called once. -222 * If the canvas parameter is not set, it will create a Canvas itself, -223 * and the developer must explicitly add the canvas to the desired DOM position. -224 * This method will also set the Canvas dimension to the specified values -225 * by width and height parameters. -226 * -227 * @param width {number} a canvas width -228 * @param height {number} a canvas height -229 * @param canvas {HTMLCanvasElement=} An optional Canvas object. -230 * @param proxy {HTMLElement} this object can be an event proxy in case you'd like to layer different elements -231 * and want events delivered to the correct element. -232 * -233 * @return this -234 */ -235 initialize : function(width, height, canvas, proxy) { -236 canvas = canvas || document.createElement('canvas'); -237 this.canvas = canvas; -238 -239 if ( typeof proxy==='undefined' ) { -240 proxy= canvas; -241 } -242 -243 this.setBounds(0, 0, width, height); -244 this.create(); -245 this.enableEvents(proxy); -246 -247 this.timeline = new Date().getTime(); -248 -249 // transition scene -250 this.transitionScene = new CAAT.Scene().create().setBounds(0, 0, width, height); -251 var transitionCanvas = document.createElement('canvas'); -252 transitionCanvas.width = width; -253 transitionCanvas.height = height; -254 var transitionImageActor = new CAAT.Actor().create().setBackgroundImage(transitionCanvas); -255 this.transitionScene.ctx = transitionCanvas.getContext('2d'); -256 this.transitionScene.addChildImmediately(transitionImageActor); -257 this.transitionScene.setEaseListener(this); -258 -259 this.checkDebug(); -260 -261 return this; -262 }, -263 glReset : function() { -264 this.pMatrix= makeOrtho( 0, this.referenceWidth, this.referenceHeight, 0, -1, 1 ); -265 this.gl.viewport(0,0,this.canvas.width,this.canvas.height); -266 this.glColorProgram.setMatrixUniform(this.pMatrix); -267 this.glTextureProgram.setMatrixUniform(this.pMatrix); -268 this.gl.viewportWidth = this.canvas.width; -269 this.gl.viewportHeight = this.canvas.height; -270 }, -271 /** -272 * Experimental. -273 * Initialize a gl enabled director. -274 * @param width -275 * @param height -276 * @param canvas -277 */ -278 initializeGL : function(width, height, canvas, proxy) { -279 -280 canvas = canvas || document.createElement('canvas'); -281 canvas.width = width; -282 canvas.height = height; -283 -284 if ( typeof proxy==='undefined' ) { -285 proxy= canvas; -286 } -287 -288 this.referenceWidth= width; -289 this.referenceHeight=height; -290 -291 var i; -292 -293 try { -294 this.gl = canvas.getContext("experimental-webgl"/*, {antialias: false}*/); -295 this.gl.viewportWidth = width; -296 this.gl.viewportHeight = height; -297 } catch(e) { -298 } -299 -300 if (this.gl) { -301 this.canvas = canvas; -302 this.create(); -303 this.setBounds(0, 0, width, height); -304 -305 this.crc = this.ctx; -306 this.enableEvents(canvas); -307 this.timeline = new Date().getTime(); -308 -309 this.glColorProgram = new CAAT.ColorProgram(this.gl).create().initialize(); -310 this.glTextureProgram = new CAAT.TextureProgram(this.gl).create().initialize(); -311 this.glTextureProgram.useProgram(); -312 this.glReset(); -313 +169 setScaleProportional : function(w,h) { +170 +171 var factor= Math.min(w/this.referenceWidth, h/this.referenceHeight); +172 +173 this.setScaleAnchored( factor, factor, 0, 0 ); +174 +175 this.canvas.width = this.referenceWidth*factor; +176 this.canvas.height = this.referenceHeight*factor; +177 this.ctx = this.canvas.getContext(this.glEnabled ? 'experimental-webgl' : '2d' ); +178 this.crc = this.ctx; +179 +180 if ( this.glEnabled ) { +181 this.glReset(); +182 } +183 }, +184 /** +185 * Enable window resize events and set redimension policy. A callback functio could be supplied +186 * to be notified on a Director redimension event. This is necessary in the case you set a redim +187 * policy not equal to RESIZE_PROPORTIONAL. In those redimension modes, director's area and their +188 * children scenes are resized to fit the new area. But scenes content is not resized, and have +189 * no option of knowing so uless an onResizeCallback function is supplied. +190 * +191 * @param mode {number} RESIZE_BOTH, RESIZE_WIDTH, RESIZE_HEIGHT, RESIZE_NONE. +192 * @param onResizeCallback {function(director{CAAT.Director}, width{integer}, height{integer})} a callback +193 * to notify on canvas resize. +194 */ +195 enableResizeEvents : function(mode, onResizeCallback) { +196 if (mode === this.RESIZE_BOTH || mode === this.RESIZE_WIDTH || mode === this.RESIZE_HEIGHT || mode===this.RESIZE_PROPORTIONAL) { +197 this.referenceWidth= this.width; +198 this.referenceHeight=this.height; +199 this.resize = mode; +200 CAAT.registerResizeListener(this); +201 this.onResizeCallback= onResizeCallback; +202 this.windowResized( window.innerWidth, window.innerHeight ); +203 } else { +204 CAAT.unregisterResizeListener(this); +205 this.onResizeCallback= null; +206 } +207 }, +208 /** +209 * Set this director's bounds as well as its contained scenes. +210 * @param x {number} ignored, will be 0. +211 * @param y {number} ignored, will be 0. +212 * @param w {number} director width. +213 * @param h {number} director height. +214 * +215 * @return this +216 */ +217 setBounds : function(x, y, w, h) { +218 CAAT.Director.superclass.setBounds.call(this, x, y, w, h); +219 +220 this.canvas.width = w; +221 this.canvas.height = h; +222 this.ctx = this.canvas.getContext(this.glEnabled ? 'experimental-webgl' : '2d'); +223 this.crc = this.ctx; +224 +225 for (var i = 0; i < this.scenes.length; i++) { +226 this.scenes[i].setBounds(0, 0, w, h); +227 } +228 +229 if ( this.glEnabled ) { +230 this.glReset(); +231 } +232 +233 return this; +234 }, +235 /** +236 * This method performs Director initialization. Must be called once. +237 * If the canvas parameter is not set, it will create a Canvas itself, +238 * and the developer must explicitly add the canvas to the desired DOM position. +239 * This method will also set the Canvas dimension to the specified values +240 * by width and height parameters. +241 * +242 * @param width {number} a canvas width +243 * @param height {number} a canvas height +244 * @param canvas {HTMLCanvasElement=} An optional Canvas object. +245 * @param proxy {HTMLElement} this object can be an event proxy in case you'd like to layer different elements +246 * and want events delivered to the correct element. +247 * +248 * @return this +249 */ +250 initialize : function(width, height, canvas, proxy) { +251 canvas = canvas || document.createElement('canvas'); +252 this.canvas = canvas; +253 +254 if ( typeof proxy==='undefined' ) { +255 proxy= canvas; +256 } +257 +258 this.setBounds(0, 0, width, height); +259 this.create(); +260 this.enableEvents(proxy); +261 +262 this.timeline = new Date().getTime(); +263 +264 // transition scene +265 this.transitionScene = new CAAT.Scene().create().setBounds(0, 0, width, height); +266 var transitionCanvas = document.createElement('canvas'); +267 transitionCanvas.width = width; +268 transitionCanvas.height = height; +269 var transitionImageActor = new CAAT.Actor().create().setBackgroundImage(transitionCanvas); +270 this.transitionScene.ctx = transitionCanvas.getContext('2d'); +271 this.transitionScene.addChildImmediately(transitionImageActor); +272 this.transitionScene.setEaseListener(this); +273 +274 this.checkDebug(); +275 +276 return this; +277 }, +278 glReset : function() { +279 this.pMatrix= makeOrtho( 0, this.referenceWidth, this.referenceHeight, 0, -1, 1 ); +280 this.gl.viewport(0,0,this.canvas.width,this.canvas.height); +281 this.glColorProgram.setMatrixUniform(this.pMatrix); +282 this.glTextureProgram.setMatrixUniform(this.pMatrix); +283 this.gl.viewportWidth = this.canvas.width; +284 this.gl.viewportHeight = this.canvas.height; +285 }, +286 /** +287 * Experimental. +288 * Initialize a gl enabled director. +289 * @param width +290 * @param height +291 * @param canvas +292 */ +293 initializeGL : function(width, height, canvas, proxy) { +294 +295 canvas = canvas || document.createElement('canvas'); +296 canvas.width = width; +297 canvas.height = height; +298 +299 if ( typeof proxy==='undefined' ) { +300 proxy= canvas; +301 } +302 +303 this.referenceWidth= width; +304 this.referenceHeight=height; +305 +306 var i; +307 +308 try { +309 this.gl = canvas.getContext("experimental-webgl"/*, {antialias: false}*/); +310 this.gl.viewportWidth = width; +311 this.gl.viewportHeight = height; +312 } catch(e) { +313 } 314 -315 var maxTris = 512; -316 this.coords = new Float32Array(maxTris * 12); -317 this.uv = new Float32Array(maxTris * 8); -318 -319 this.gl.clearColor(0.0, 0.0, 0.0, 255); -320 -321 if (this.front_to_back) { -322 this.gl.clearDepth(1.0); -323 this.gl.enable(this.gl.DEPTH_TEST); -324 this.gl.depthFunc(this.gl.LESS); -325 } else { -326 this.gl.disable(this.gl.DEPTH_TEST); -327 } +315 if (this.gl) { +316 this.canvas = canvas; +317 this.create(); +318 this.setBounds(0, 0, width, height); +319 +320 this.crc = this.ctx; +321 this.enableEvents(canvas); +322 this.timeline = new Date().getTime(); +323 +324 this.glColorProgram = new CAAT.ColorProgram(this.gl).create().initialize(); +325 this.glTextureProgram = new CAAT.TextureProgram(this.gl).create().initialize(); +326 this.glTextureProgram.useProgram(); +327 this.glReset(); 328 -329 this.gl.enable(this.gl.BLEND); -330 // Fix FF this.gl.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE_MINUS_SRC_ALPHA); -331 this.gl.blendFunc(this.gl.ONE, this.gl.ONE_MINUS_SRC_ALPHA); -332 this.glEnabled = true; +329 +330 var maxTris = 512; +331 this.coords = new Float32Array(maxTris * 12); +332 this.uv = new Float32Array(maxTris * 8); 333 -334 this.checkDebug(); -335 } else { -336 // fallback to non gl enabled canvas. -337 return this.initialize(width, height, canvas); -338 } -339 -340 return this; -341 }, -342 /** -343 * Creates an initializes a Scene object. -344 * @return {CAAT.Scene} -345 */ -346 createScene : function() { -347 var scene = new CAAT.Scene().create(); -348 this.addScene(scene); -349 return scene; -350 }, -351 setImagesCache : function(imagesCache, tpW, tpH) { -352 -353 var i; +334 this.gl.clearColor(0.0, 0.0, 0.0, 255); +335 +336 if (this.front_to_back) { +337 this.gl.clearDepth(1.0); +338 this.gl.enable(this.gl.DEPTH_TEST); +339 this.gl.depthFunc(this.gl.LESS); +340 } else { +341 this.gl.disable(this.gl.DEPTH_TEST); +342 } +343 +344 this.gl.enable(this.gl.BLEND); +345 // Fix FF this.gl.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE_MINUS_SRC_ALPHA); +346 this.gl.blendFunc(this.gl.ONE, this.gl.ONE_MINUS_SRC_ALPHA); +347 this.glEnabled = true; +348 +349 this.checkDebug(); +350 } else { +351 // fallback to non gl enabled canvas. +352 return this.initialize(width, height, canvas); +353 } 354 -355 if (null !== this.glTextureManager) { -356 this.glTextureManager.deletePages(); -357 this.glTextureManager = null; -358 } -359 -360 // delete previous image identifiers -361 if ( this.imagesCache ) { -362 var ids= []; -363 for ( i = 0; i < this.imagesCache.length; i++) { -364 ids.push( this.imagesCache[i].id ); -365 } -366 -367 for( i=0; i<ids.length; i++ ) { -368 delete this.imagesCache[ ids[i] ]; -369 } -370 } -371 -372 this.imagesCache = imagesCache; -373 -374 if ( imagesCache ) { -375 for ( i = 0; i < imagesCache.length; i++) { -376 this.imagesCache[ imagesCache[i].id ] = imagesCache[i].image; -377 } -378 } -379 -380 this.tpW = tpW || 2048; -381 this.tpH = tpH || 2048; -382 -383 this.updateGLPages(); -384 }, -385 updateGLPages : function() { -386 if (this.glEnabled) { -387 -388 this.glTextureManager = new CAAT.GLTexturePageManager(); -389 this.glTextureManager.createPages(this.gl, this.tpW, this.tpH, this.imagesCache); -390 -391 this.currentTexturePage = this.glTextureManager.pages[0]; -392 this.glTextureProgram.setTexture(this.currentTexturePage.texture); +355 return this; +356 }, +357 /** +358 * Creates an initializes a Scene object. +359 * @return {CAAT.Scene} +360 */ +361 createScene : function() { +362 var scene = new CAAT.Scene().create(); +363 this.addScene(scene); +364 return scene; +365 }, +366 setImagesCache : function(imagesCache, tpW, tpH) { +367 +368 var i; +369 +370 if (null !== this.glTextureManager) { +371 this.glTextureManager.deletePages(); +372 this.glTextureManager = null; +373 } +374 +375 // delete previous image identifiers +376 if ( this.imagesCache ) { +377 var ids= []; +378 for ( i = 0; i < this.imagesCache.length; i++) { +379 ids.push( this.imagesCache[i].id ); +380 } +381 +382 for( i=0; i<ids.length; i++ ) { +383 delete this.imagesCache[ ids[i] ]; +384 } +385 } +386 +387 this.imagesCache = imagesCache; +388 +389 if ( imagesCache ) { +390 for ( i = 0; i < imagesCache.length; i++) { +391 this.imagesCache[ imagesCache[i].id ] = imagesCache[i].image; +392 } 393 } -394 }, -395 setGLTexturePage : function( tp ) { -396 this.currentTexturePage = tp; -397 this.glTextureProgram.setTexture(tp.texture); -398 return this; +394 +395 this.tpW = tpW || 2048; +396 this.tpH = tpH || 2048; +397 +398 this.updateGLPages(); 399 }, -400 /** -401 * Add a new image to director's image cache. If gl is enabled and the 'noUpdateGL' is not set to true this -402 * function will try to recreate the whole GL texture pages. -403 * If many handcrafted images are to be added to the director, some performance can be achieved by calling -404 * <code>director.addImage(id,image,false)</code> many times and a final call with -405 * <code>director.addImage(id,image,true)</code> to finally command the director to create texture pages. -406 * -407 * @param id {string|object} an identitifier to retrieve the image with -408 * @param image {Image|HTMLCanvasElement} image to add to cache -409 * @param noUpdateGL {!boolean} unless otherwise stated, the director will -410 * try to recreate the texture pages. -411 */ -412 addImage : function( id, image, noUpdateGL ) { -413 if ( this.getImage(id) ) { -414 for (var i = 0; i < this.imagesCache.length; i++) { -415 if (this.imagesCache[i].id === id) { -416 this.imagesCache[i].image = image; -417 break; -418 } -419 } -420 this.imagesCache[ id ] = image; -421 } else { -422 this.imagesCache.push( { id: id, image: image } ); -423 this.imagesCache[id]= image; -424 } -425 -426 if ( !!!noUpdateGL ) { -427 this.updateGLPages( ); -428 } -429 }, -430 deleteImage : function( id, noUpdateGL ) { -431 for (var i = 0; i < this.imagesCache.length; i++) { -432 if (this.imagesCache[i].id === id) { -433 delete this.imagesCache[id]; -434 this.imagesCache.splice(i,1); -435 break; -436 } -437 } -438 if ( !!!noUpdateGL ) { -439 this.updateGLPages(); -440 } -441 }, -442 setGLCurrentOpacity : function(opacity) { -443 this.currentOpacity = opacity; -444 this.glTextureProgram.setAlpha(opacity); -445 }, -446 /** -447 * Render buffered elements. -448 * @param vertex -449 * @param coordsIndex -450 * @param uv -451 */ -452 glRender : function(vertex, coordsIndex, uv) { -453 -454 vertex = vertex || this.coords; -455 uv = uv || this.uv; -456 coordsIndex = coordsIndex || this.coordsIndex; -457 -458 var gl = this.gl; -459 -460 var numTris = coordsIndex / 12 * 2; -461 var numVertices = coordsIndex / 3; -462 -463 this.glTextureProgram.updateVertexBuffer(vertex); -464 this.glTextureProgram.updateUVBuffer(uv); -465 -466 gl.drawElements(gl.TRIANGLES, 3 * numTris, gl.UNSIGNED_SHORT, 0); -467 -468 }, -469 glFlush : function() { -470 if (this.coordsIndex !== 0) { -471 this.glRender(this.coords, this.coordsIndex, this.uv); -472 } -473 this.coordsIndex = 0; -474 this.uvIndex = 0; -475 -476 this.statistics.draws++; -477 }, -478 -479 findActorAtPosition : function(point) { +400 updateGLPages : function() { +401 if (this.glEnabled) { +402 +403 this.glTextureManager = new CAAT.GLTexturePageManager(); +404 this.glTextureManager.createPages(this.gl, this.tpW, this.tpH, this.imagesCache); +405 +406 this.currentTexturePage = this.glTextureManager.pages[0]; +407 this.glTextureProgram.setTexture(this.currentTexturePage.texture); +408 } +409 }, +410 setGLTexturePage : function( tp ) { +411 this.currentTexturePage = tp; +412 this.glTextureProgram.setTexture(tp.texture); +413 return this; +414 }, +415 /** +416 * Add a new image to director's image cache. If gl is enabled and the 'noUpdateGL' is not set to true this +417 * function will try to recreate the whole GL texture pages. +418 * If many handcrafted images are to be added to the director, some performance can be achieved by calling +419 * <code>director.addImage(id,image,false)</code> many times and a final call with +420 * <code>director.addImage(id,image,true)</code> to finally command the director to create texture pages. +421 * +422 * @param id {string|object} an identitifier to retrieve the image with +423 * @param image {Image|HTMLCanvasElement} image to add to cache +424 * @param noUpdateGL {!boolean} unless otherwise stated, the director will +425 * try to recreate the texture pages. +426 */ +427 addImage : function( id, image, noUpdateGL ) { +428 if ( this.getImage(id) ) { +429 for (var i = 0; i < this.imagesCache.length; i++) { +430 if (this.imagesCache[i].id === id) { +431 this.imagesCache[i].image = image; +432 break; +433 } +434 } +435 this.imagesCache[ id ] = image; +436 } else { +437 this.imagesCache.push( { id: id, image: image } ); +438 this.imagesCache[id]= image; +439 } +440 +441 if ( !!!noUpdateGL ) { +442 this.updateGLPages( ); +443 } +444 }, +445 deleteImage : function( id, noUpdateGL ) { +446 for (var i = 0; i < this.imagesCache.length; i++) { +447 if (this.imagesCache[i].id === id) { +448 delete this.imagesCache[id]; +449 this.imagesCache.splice(i,1); +450 break; +451 } +452 } +453 if ( !!!noUpdateGL ) { +454 this.updateGLPages(); +455 } +456 }, +457 setGLCurrentOpacity : function(opacity) { +458 this.currentOpacity = opacity; +459 this.glTextureProgram.setAlpha(opacity); +460 }, +461 /** +462 * Render buffered elements. +463 * @param vertex +464 * @param coordsIndex +465 * @param uv +466 */ +467 glRender : function(vertex, coordsIndex, uv) { +468 +469 vertex = vertex || this.coords; +470 uv = uv || this.uv; +471 coordsIndex = coordsIndex || this.coordsIndex; +472 +473 var gl = this.gl; +474 +475 var numTris = coordsIndex / 12 * 2; +476 var numVertices = coordsIndex / 3; +477 +478 this.glTextureProgram.updateVertexBuffer(vertex); +479 this.glTextureProgram.updateUVBuffer(uv); 480 -481 // z-order -482 var cl= this.childrenList; -483 for( var i=cl.length-1; i>=0; i-- ) { -484 var child= this.childrenList[i]; -485 -486 var np= new CAAT.Point( point.x, point.y, 0 ); -487 var contained= child.findActorAtPosition( np ); -488 if ( null!==contained ) { -489 return contained; -490 } -491 } -492 -493 return this; -494 }, +481 gl.drawElements(gl.TRIANGLES, 3 * numTris, gl.UNSIGNED_SHORT, 0); +482 +483 }, +484 glFlush : function() { +485 if (this.coordsIndex !== 0) { +486 this.glRender(this.coords, this.coordsIndex, this.uv); +487 } +488 this.coordsIndex = 0; +489 this.uvIndex = 0; +490 +491 this.statistics.draws++; +492 }, +493 +494 findActorAtPosition : function(point) { 495 -496 -497 resetStats : function() { -498 this.statistics.size_total= 0; -499 this.statistics.size_active=0; -500 this.statistics.draws= 0; -501 }, -502 -503 /** -504 * This is the entry point for the animation system of the Director. -505 * The director is fed with the elapsed time value to maintain a virtual timeline. -506 * This virtual timeline will provide each Scene with its own virtual timeline, and will only -507 * feed time when the Scene is the current Scene, or is being switched. -508 * -509 * @param time {number} integer indicating the elapsed time between two consecutive frames of the -510 * Director. -511 */ -512 render : function(time) { -513 -514 this.time += time; -515 -516 this.animate(this,time); -517 -518 if ( CAAT.DEBUG ) { -519 this.resetStats(); -520 } -521 -522 /** -523 * draw director active scenes. -524 */ -525 var ne = this.childrenList.length; -526 var i, tt, c; -527 if (this.glEnabled) { -528 -529 this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT); -530 this.coordsIndex = 0; -531 this.uvIndex = 0; -532 -533 for (i = 0; i < ne; i++) { -534 c = this.childrenList[i]; -535 if (c.isInAnimationFrame(this.time)) { -536 tt = c.time - c.start_time; -537 if ( c.onRenderStart ) { -538 c.onRenderStart(tt); -539 } -540 c.paintActorGL(this, tt); -541 if ( c.onRenderEnd ) { -542 c.onRenderEnd(tt); -543 } +496 // z-order +497 var cl= this.childrenList; +498 for( var i=cl.length-1; i>=0; i-- ) { +499 var child= this.childrenList[i]; +500 +501 var np= new CAAT.Point( point.x, point.y, 0 ); +502 var contained= child.findActorAtPosition( np ); +503 if ( null!==contained ) { +504 return contained; +505 } +506 } +507 +508 return this; +509 }, +510 +511 /** +512 * +513 * Reset statistics information. +514 * +515 * @private +516 */ +517 resetStats : function() { +518 this.statistics.size_total= 0; +519 this.statistics.size_active=0; +520 this.statistics.draws= 0; +521 }, +522 +523 /** +524 * This is the entry point for the animation system of the Director. +525 * The director is fed with the elapsed time value to maintain a virtual timeline. +526 * This virtual timeline will provide each Scene with its own virtual timeline, and will only +527 * feed time when the Scene is the current Scene, or is being switched. +528 * +529 * If dirty rectangles are enabled and canvas is used for rendering, the dirty rectangles will be +530 * set up as a single clip area. +531 * +532 * @param time {number} integer indicating the elapsed time between two consecutive frames of the +533 * Director. +534 */ +535 render : function(time) { +536 +537 this.time += time; +538 +539 this.animate(this,time); +540 +541 if ( CAAT.DEBUG ) { +542 this.resetStats(); +543 } 544 -545 if ( !c.isPaused() ) { -546 c.time += time; -547 } -548 -549 if ( CAAT.DEBUG ) { -550 this.statistics.size_total+= c.size_total; -551 this.statistics.size_active+= c.size_active; -552 } +545 /** +546 * draw director active scenes. +547 */ +548 var ne = this.childrenList.length; +549 var i, tt, c; +550 var ctx= this.ctx; +551 +552 if (this.glEnabled) { 553 -554 } -555 } -556 -557 this.glFlush(); -558 -559 } else { -560 this.ctx.globalAlpha = 1; -561 this.ctx.globalCompositeOperation = 'source-over'; -562 -563 if (this.clear) { -564 this.ctx.clearRect(0, 0, this.width, this.height); -565 } -566 -567 for (i = 0; i < ne; i++) { -568 c= this.childrenList[i]; +554 this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT); +555 this.coordsIndex = 0; +556 this.uvIndex = 0; +557 +558 for (i = 0; i < ne; i++) { +559 c = this.childrenList[i]; +560 if (c.isInAnimationFrame(this.time)) { +561 tt = c.time - c.start_time; +562 if ( c.onRenderStart ) { +563 c.onRenderStart(tt); +564 } +565 c.paintActorGL(this, tt); +566 if ( c.onRenderEnd ) { +567 c.onRenderEnd(tt); +568 } 569 -570 if (c.isInAnimationFrame(this.time)) { -571 tt = c.time - c.start_time; -572 this.ctx.save(); +570 if ( !c.isPaused() ) { +571 c.time += time; +572 } 573 -574 if ( c.onRenderStart ) { -575 c.onRenderStart(tt); -576 } -577 c.paintActor(this, tt); -578 if ( c.onRenderEnd ) { -579 c.onRenderEnd(tt); -580 } -581 this.ctx.restore(); -582 -583 if (CAAT.DEBUGAABB) { -584 this.ctx.globalAlpha= 1; -585 this.ctx.globalCompositeOperation= 'source-over'; -586 this.modelViewMatrix.transformRenderingContextSet( this.ctx ); -587 c.drawScreenBoundingBox(this, tt); -588 } -589 -590 if ( !c.isPaused() ) { -591 c.time += time; -592 } -593 -594 if ( CAAT.DEBUG ) { -595 this.statistics.size_total+= c.size_total; -596 this.statistics.size_active+= c.size_active; +574 if ( CAAT.DEBUG ) { +575 this.statistics.size_total+= c.size_total; +576 this.statistics.size_active+= c.size_active; +577 } +578 +579 } +580 } +581 +582 this.glFlush(); +583 +584 } else { +585 ctx.globalAlpha = 1; +586 ctx.globalCompositeOperation = 'source-over'; +587 +588 ctx.save(); +589 if ( this.dirtyRectsEnabled ) { +590 +591 ctx.beginPath(); +592 var dr= this.cDirtyRects; +593 for( i=0; i<dr.length; i++ ) { +594 var drr= dr[i]; +595 if ( !drr.isEmpty() ) { +596 ctx.rect( drr.x|0, drr.y|0, 1+(drr.width|0), 1+(drr.height|0) ); 597 } -598 -599 } -600 } -601 } -602 -603 this.frameCounter++; -604 }, -605 /** -606 * A director is a very special kind of actor. -607 * Its animation routine simple sets its modelViewMatrix in case some transformation's been -608 * applied. -609 * No behaviors are allowed for Director instances. -610 * @param director {CAAT.Director} redundant reference to CAAT.Director itself -611 * @param time {number} director time. -612 */ -613 animate : function(director, time) { -614 this.setModelViewMatrix(this.glEnabled); -615 -616 var cl= this.childrenList; -617 var cli; -618 for (var i = 0; i < cl.length; i++) { -619 cli= cl[i]; -620 var tt = cli.time - cli.start_time; -621 cli.animate(this, tt); -622 } -623 -624 return this; -625 }, -626 /** -627 * This method draws an Scene to an offscreen canvas. This offscreen canvas is also a child of -628 * another Scene (transitionScene). So instead of drawing two scenes while transitioning from -629 * one to another, first of all an scene is drawn to offscreen, and that image is translated. -630 * <p> -631 * Until the creation of this method, both scenes where drawn while transitioning with -632 * its performance penalty since drawing two scenes could be twice as expensive than drawing -633 * only one. -634 * <p> -635 * Though a high performance increase, we should keep an eye on memory consumption. -636 * -637 * @param ctx a <code>canvas.getContext('2d')</code> instnce. -638 * @param scene {CAAT.Scene} the scene to draw offscreen. -639 */ -640 renderToContext : function(ctx, scene) { -641 /** -642 * draw actors on scene. -643 */ -644 if (scene.isInAnimationFrame(this.time)) { -645 ctx.globalAlpha = 1; -646 ctx.globalCompositeOperation = 'source-over'; -647 ctx.clearRect(0, 0, this.width, this.height); -648 ctx.setTransform(1,0,0, 0,1,0); -649 -650 var octx = this.ctx; -651 var ocrc = this.crc; -652 -653 this.ctx = this.crc = ctx; -654 ctx.save(); -655 -656 /** -657 * to draw an scene to an offscreen canvas, we have to: -658 * 1.- save diector's world model view matrix -659 * 2.- set no transformation on director since we want the offscreen to -660 * be drawn 1:1. -661 * 3.- set world dirty flag, so that the scene will recalculate its matrices -662 * 4.- animate the scene -663 * 5.- paint the scene -664 * 6.- restore world model view matrix. -665 */ -666 var matwmv= this.worldModelViewMatrix; -667 this.worldModelViewMatrix= new CAAT.Matrix(); -668 this.wdirty= true; -669 scene.animate(this, scene.time); -670 if ( scene.onRenderStart ) { -671 scene.onRenderStart(scene.time); -672 } -673 scene.paintActor(this, scene.time); -674 if ( scene.onRenderEnd ) { -675 scene.onRenderEnd(scene.time); -676 } -677 this.worldModelViewMatrix = matwmv; -678 -679 ctx.restore(); -680 -681 this.ctx = octx; -682 this.crc = ocrc; -683 } -684 }, -685 /** -686 * Add a new Scene to Director's Scene list. By adding a Scene to the Director -687 * does not mean it will be immediately visible, you should explicitly call either -688 * <ul> -689 * <li>easeIn -690 * <li>easeInOut -691 * <li>easeInOutRandom -692 * <li>setScene -693 * <li>or any of the scene switching methods -694 * </ul> -695 * -696 * @param scene {CAAT.Scene} an CAAT.Scene object. -697 */ -698 addScene : function(scene) { -699 scene.setBounds(0, 0, this.width, this.height); -700 this.scenes.push(scene); -701 scene.setEaseListener(this); -702 if (null === this.currentScene) { -703 this.setScene(0); -704 } -705 }, -706 /** -707 * Get the number of scenes contained in the Director. -708 * @return {number} the number of scenes contained in the Director. -709 */ -710 getNumScenes : function() { -711 return this.scenes.length; -712 }, -713 /** -714 * This method offers full control over the process of switching between any given two Scenes. -715 * To apply this method, you must specify the type of transition to apply for each Scene and -716 * the anchor to keep the Scene pinned at. -717 * <p> -718 * The type of transition will be one of the following values defined in CAAT.Scene.prototype: -719 * <ul> -720 * <li>EASE_ROTATION -721 * <li>EASE_SCALE -722 * <li>EASE_TRANSLATION -723 * </ul> -724 * -725 * <p> -726 * The anchor will be any of these values defined in CAAT.Actor.prototype: -727 * <ul> -728 * <li>ANCHOR_CENTER -729 * <li>ANCHOR_TOP -730 * <li>ANCHOR_BOTTOM -731 * <li>ANCHOR_LEFT -732 * <li>ANCHOR_RIGHT -733 * <li>ANCHOR_TOP_LEFT -734 * <li>ANCHOR_TOP_RIGHT -735 * <li>ANCHOR_BOTTOM_LEFT -736 * <li>ANCHOR_BOTTOM_RIGHT -737 * </ul> -738 * -739 * <p> -740 * In example, for an entering scene performing a EASE_SCALE transition, the anchor is the -741 * point by which the scene will scaled. -742 * -743 * @param inSceneIndex integer indicating the Scene index to bring in to the Director. -744 * @param typein integer indicating the type of transition to apply to the bringing in Scene. -745 * @param anchorin integer indicating the anchor of the bringing in Scene. -746 * @param outSceneIndex integer indicating the Scene index to take away from the Director. -747 * @param typeout integer indicating the type of transition to apply to the taking away in Scene. -748 * @param anchorout integer indicating the anchor of the taking away Scene. -749 * @param time inteter indicating the time to perform the process of switchihg between Scene object -750 * in milliseconds. -751 * @param alpha boolean boolean indicating whether alpha transparency fading will be applied to -752 * the scenes. -753 * @param interpolatorIn CAAT.Interpolator object to apply to entering scene. -754 * @param interpolatorOut CAAT.Interpolator object to apply to exiting scene. -755 */ -756 easeInOut : function(inSceneIndex, typein, anchorin, outSceneIndex, typeout, anchorout, time, alpha, interpolatorIn, interpolatorOut) { -757 -758 if (inSceneIndex === this.getCurrentSceneIndex()) { -759 return; -760 } -761 -762 var ssin = this.scenes[ inSceneIndex ]; -763 var sout = this.scenes[ outSceneIndex ]; -764 -765 if (!this.glEnabled && !navigator.browser==='iOS') { -766 this.worldModelViewMatrix.transformRenderingContext(this.transitionScene.ctx); -767 this.renderToContext(this.transitionScene.ctx, sout); -768 sout = this.transitionScene; -769 } -770 -771 ssin.setExpired(false); -772 sout.setExpired(false); -773 -774 ssin.mouseEnabled = false; -775 sout.mouseEnabled = false; -776 -777 ssin.resetTransform(); -778 sout.resetTransform(); -779 -780 ssin.setLocation(0, 0); -781 sout.setLocation(0, 0); -782 -783 ssin.alpha = 1; -784 sout.alpha = 1; -785 -786 if (typein === CAAT.Scene.prototype.EASE_ROTATION) { -787 ssin.easeRotationIn(time, alpha, anchorin, interpolatorIn); -788 } else if (typein === CAAT.Scene.prototype.EASE_SCALE) { -789 ssin.easeScaleIn(0, time, alpha, anchorin, interpolatorIn); -790 } else { -791 ssin.easeTranslationIn(time, alpha, anchorin, interpolatorIn); -792 } -793 -794 if (typeout === CAAT.Scene.prototype.EASE_ROTATION) { -795 sout.easeRotationOut(time, alpha, anchorout, interpolatorOut); -796 } else if (typeout === CAAT.Scene.prototype.EASE_SCALE) { -797 sout.easeScaleOut(0, time, alpha, anchorout, interpolatorOut); -798 } else { -799 sout.easeTranslationOut(time, alpha, anchorout, interpolatorOut); -800 } -801 -802 this.childrenList = []; -803 -804 this.addChild(sout); -805 this.addChild(ssin); -806 }, -807 /** -808 * This method will switch between two given Scene indexes (ie, take away scene number 2, -809 * and bring in scene number 5). -810 * <p> -811 * It will randomly choose for each Scene the type of transition to apply and the anchor -812 * point of each transition type. -813 * <p> -814 * It will also set for different kind of transitions the following interpolators: -815 * <ul> -816 * <li>EASE_ROTATION -> ExponentialInOutInterpolator, exponent 4. -817 * <li>EASE_SCALE -> ElasticOutInterpolator, 1.1 and .4 -818 * <li>EASE_TRANSLATION -> BounceOutInterpolator -819 * </ul> -820 * -821 * <p> -822 * These are the default values, and could not be changed by now. -823 * This method in final instance delegates the process to easeInOutMethod. -824 * -825 * @see easeInOutMethod. -826 * -827 * @param inIndex integer indicating the entering scene index. -828 * @param outIndex integer indicating the exiting scene index. -829 * @param time integer indicating the time to take for the process of Scene in/out in milliseconds. -830 * @param alpha boolean indicating whether alpha transparency fading should be applied to transitions. -831 */ -832 easeInOutRandom : function(inIndex, outIndex, time, alpha) { -833 -834 var pin = Math.random(); -835 var pout = Math.random(); -836 -837 var typeIn; -838 var interpolatorIn; -839 -840 if (pin < 0.33) { -841 typeIn = CAAT.Scene.prototype.EASE_ROTATION; -842 interpolatorIn = new CAAT.Interpolator().createExponentialInOutInterpolator(4); -843 } else if (pin < 0.66) { -844 typeIn = CAAT.Scene.prototype.EASE_SCALE; -845 interpolatorIn = new CAAT.Interpolator().createElasticOutInterpolator(1.1, 0.4); -846 } else { -847 typeIn = CAAT.Scene.prototype.EASE_TRANSLATE; -848 interpolatorIn = new CAAT.Interpolator().createBounceOutInterpolator(); -849 } -850 -851 var typeOut; -852 var interpolatorOut; -853 -854 if (pout < 0.33) { -855 typeOut = CAAT.Scene.prototype.EASE_ROTATION; -856 interpolatorOut = new CAAT.Interpolator().createExponentialInOutInterpolator(4); -857 } else if (pout < 0.66) { -858 typeOut = CAAT.Scene.prototype.EASE_SCALE; -859 interpolatorOut = new CAAT.Interpolator().createExponentialOutInterpolator(4); -860 } else { -861 typeOut = CAAT.Scene.prototype.EASE_TRANSLATE; -862 interpolatorOut = new CAAT.Interpolator().createBounceOutInterpolator(); -863 } -864 -865 this.easeInOut( -866 inIndex, -867 typeIn, -868 (Math.random() * 8.99) >> 0, -869 -870 outIndex, -871 typeOut, -872 (Math.random() * 8.99) >> 0, -873 -874 time, -875 alpha, -876 -877 interpolatorIn, -878 interpolatorOut); -879 -880 }, -881 /** -882 * This method changes Director's current Scene to the scene index indicated by -883 * inSceneIndex parameter. The Scene running in the director won't be eased out. -884 * -885 * @see {CAAT.Interpolator} -886 * @see {CAAT.Actor} -887 * @see {CAAT.Scene} -888 * -889 * @param inSceneIndex integer indicating the new Scene to set as current. -890 * @param type integer indicating the type of transition to apply to bring the new current -891 * Scene to the Director. The values will be one of: CAAT.Scene.prototype.EASE_ROTATION, -892 * CAAT.Scene.prototype.EASE_SCALE, CAAT.Scene.prototype.EASE_TRANSLATION. -893 * @param time integer indicating how much time in milliseconds the Scene entrance will take. -894 * @param alpha boolean indicating whether alpha transparency fading will be applied to the -895 * entereing Scene. -896 * @param anchor integer indicating the anchor to fix for Scene transition. It will be any of -897 * CAAT.Actor.prototype.ANCHOR_* values. -898 * @param interpolator an CAAT.Interpolator object indicating the interpolation function to -899 * apply. -900 */ -901 easeIn : function(inSceneIndex, type, time, alpha, anchor, interpolator) { -902 var sin = this.scenes[ inSceneIndex ]; -903 if (type === CAAT.Scene.prototype.EASE_ROTATION) { -904 sin.easeRotationIn(time, alpha, anchor, interpolator); -905 } else if (type === CAAT.Scene.prototype.EASE_SCALE) { -906 sin.easeScaleIn(0, time, alpha, anchor, interpolator); -907 } else { -908 sin.easeTranslationIn(time, alpha, anchor, interpolator); -909 } -910 this.childrenList = []; -911 this.addChild(sin); -912 -913 sin.resetTransform(); -914 sin.setLocation(0, 0); -915 sin.alpha = 1; -916 sin.mouseEnabled = false; -917 sin.setExpired(false); -918 }, -919 /** -920 * Changes (or sets) the current Director scene to the index -921 * parameter. There will be no transition on scene change. -922 * @param sceneIndex {number} an integer indicating the index of the target Scene -923 * to be shown. -924 */ -925 setScene : function(sceneIndex) { -926 var sin = this.scenes[ sceneIndex ]; -927 this.childrenList = []; -928 this.addChild(sin); -929 this.currentScene = sin; -930 -931 sin.setExpired(false); -932 sin.mouseEnabled = true; -933 sin.resetTransform(); -934 sin.setLocation(0, 0); -935 sin.alpha = 1; -936 -937 sin.activated(); -938 }, -939 /** -940 * This method will change the current Scene by the Scene indicated as parameter. -941 * It will apply random values for anchor and transition type. -942 * @see easeInOutRandom -943 * -944 * @param iNewSceneIndex {number} an integer indicating the index of the new scene to run on the Director. -945 * @param time {number} an integer indicating the time the Scene transition will take. -946 * @param alpha {boolean} a boolean indicating whether Scene transition should be fading. -947 * @param transition {boolean} a boolean indicating whether the scene change must smoothly animated. -948 */ -949 switchToScene : function(iNewSceneIndex, time, alpha, transition) { -950 var currentSceneIndex = this.getSceneIndex(this.currentScene); -951 -952 if (!transition) { -953 this.setScene(iNewSceneIndex); -954 } -955 else { -956 this.easeInOutRandom(iNewSceneIndex, currentSceneIndex, time, alpha); -957 } -958 }, -959 /** -960 * Sets the previous Scene in sequence as the current Scene. -961 * @see switchToScene. -962 * -963 * @param time {number} integer indicating the time the Scene transition will take. -964 * @param alpha {boolean} a boolean indicating whether Scene transition should be fading. -965 * @param transition {boolean} a boolean indicating whether the scene change must smoothly animated. -966 */ -967 switchToPrevScene : function(time, alpha, transition) { -968 -969 var currentSceneIndex = this.getSceneIndex(this.currentScene); -970 -971 if (this.getNumScenes() <= 1 || currentSceneIndex === 0) { -972 return; +598 } +599 ctx.clip(); +600 } else if (this.clear===true ) { +601 ctx.clearRect(0, 0, this.width, this.height); +602 } +603 +604 for (i = 0; i < ne; i++) { +605 c= this.childrenList[i]; +606 +607 if (c.isInAnimationFrame(this.time)) { +608 tt = c.time - c.start_time; +609 ctx.save(); +610 +611 if ( c.onRenderStart ) { +612 c.onRenderStart(tt); +613 } +614 c.paintActor(this, tt); +615 if ( c.onRenderEnd ) { +616 c.onRenderEnd(tt); +617 } +618 ctx.restore(); +619 +620 if (CAAT.DEBUGAABB) { +621 ctx.globalAlpha= 1; +622 ctx.globalCompositeOperation= 'source-over'; +623 this.modelViewMatrix.transformRenderingContextSet( ctx ); +624 c.drawScreenBoundingBox(this, tt); +625 } +626 +627 if ( !c.isPaused() ) { +628 c.time += time; +629 } +630 +631 if ( CAAT.DEBUG ) { +632 this.statistics.size_total+= c.size_total; +633 this.statistics.size_active+= c.size_active; +634 } +635 +636 } +637 } +638 +639 ctx.restore(); +640 } +641 +642 this.frameCounter++; +643 }, +644 /** +645 * A director is a very special kind of actor. +646 * Its animation routine simple sets its modelViewMatrix in case some transformation's been +647 * applied. +648 * No behaviors are allowed for Director instances. +649 * @param director {CAAT.Director} redundant reference to CAAT.Director itself +650 * @param time {number} director time. +651 */ +652 animate : function(director, time) { +653 this.setModelViewMatrix(this); +654 +655 this.dirtyRectsIndex= -1; +656 this.cDirtyRects= []; +657 +658 var cl= this.childrenList; +659 var cli; +660 for (var i = 0; i < cl.length; i++) { +661 cli= cl[i]; +662 var tt = cli.time - cli.start_time; +663 cli.animate(this, tt); +664 } +665 +666 return this; +667 }, +668 /** +669 * Add a rectangle to the list of dirty screen areas which should be redrawn. +670 * This is the opposite method to clear the whole screen and repaint everything again. +671 * Despite i'm not very fond of dirty rectangles because it needs some extra calculations, this +672 * procedure has shown to be speeding things up under certain situations. Nevertheless it doesn't or +673 * even lowers performance under others, so it is a developer choice to activate them via a call to +674 * setClear( CAAT.Director.CLEAR_DIRTY_RECTS ). +675 * +676 * This function, not only tracks a list of dirty rectangles, but tries to optimize the list. Overlapping +677 * rectangles will be removed and intersecting ones will be unioned. +678 * +679 * Before calling this method, check if this.dirtyRectsEnabled is true. +680 * +681 * @param rectangle {CAAT.Rectangle} +682 */ +683 addDirtyRect : function( rectangle ) { +684 +685 if ( rectangle.isEmpty() ) { +686 return; +687 } +688 +689 var i, dr, j, drj; +690 var cdr= this.cDirtyRects; +691 for( i=0; i<cdr.length; i++ ) { +692 dr= cdr[i]; +693 if ( dr.intersects( rectangle ) ) { +694 dr.unionRectangle( rectangle ); +695 +696 for( j=0; j<cdr.length; j++ ) { +697 if ( j!==i ) { +698 drj= cdr[j]; +699 if ( drj.intersects( dr ) ) { +700 dr.unionRectangle( drj ); +701 drj.setEmpty(); +702 } +703 } +704 } +705 +706 for( j=0; j<cdr.length; j++ ) { +707 if ( cdr[j].isEmpty() ) { +708 cdr.splice( j, 1 ); +709 } +710 } +711 +712 return; +713 } +714 } +715 +716 this.dirtyRectsIndex++; +717 +718 if ( this.dirtyRectsIndex>=this.dirtyRects.length ) { +719 for( i=0; i<32; i++ ) { +720 this.dirtyRects.push( new CAAT.Rectangle() ); +721 } +722 } +723 +724 var r= this.dirtyRects[ this.dirtyRectsIndex ]; +725 +726 r.x= rectangle.x; +727 r.y= rectangle.y; +728 r.x1= rectangle.x1; +729 r.y1= rectangle.y1; +730 r.width= rectangle.width; +731 r.height= rectangle.height; +732 +733 this.cDirtyRects.push( r ); +734 +735 }, +736 /** +737 * This method draws an Scene to an offscreen canvas. This offscreen canvas is also a child of +738 * another Scene (transitionScene). So instead of drawing two scenes while transitioning from +739 * one to another, first of all an scene is drawn to offscreen, and that image is translated. +740 * <p> +741 * Until the creation of this method, both scenes where drawn while transitioning with +742 * its performance penalty since drawing two scenes could be twice as expensive than drawing +743 * only one. +744 * <p> +745 * Though a high performance increase, we should keep an eye on memory consumption. +746 * +747 * @param ctx a <code>canvas.getContext('2d')</code> instnce. +748 * @param scene {CAAT.Scene} the scene to draw offscreen. +749 */ +750 renderToContext : function(ctx, scene) { +751 /** +752 * draw actors on scene. +753 */ +754 if (scene.isInAnimationFrame(this.time)) { +755 ctx.globalAlpha = 1; +756 ctx.globalCompositeOperation = 'source-over'; +757 ctx.clearRect(0, 0, this.width, this.height); +758 ctx.setTransform(1,0,0, 0,1,0); +759 +760 var octx = this.ctx; +761 var ocrc = this.crc; +762 +763 this.ctx = this.crc = ctx; +764 ctx.save(); +765 +766 /** +767 * to draw an scene to an offscreen canvas, we have to: +768 * 1.- save diector's world model view matrix +769 * 2.- set no transformation on director since we want the offscreen to +770 * be drawn 1:1. +771 * 3.- set world dirty flag, so that the scene will recalculate its matrices +772 * 4.- animate the scene +773 * 5.- paint the scene +774 * 6.- restore world model view matrix. +775 */ +776 var matwmv= this.worldModelViewMatrix; +777 this.worldModelViewMatrix= new CAAT.Matrix(); +778 this.wdirty= true; +779 scene.animate(this, scene.time); +780 if ( scene.onRenderStart ) { +781 scene.onRenderStart(scene.time); +782 } +783 scene.paintActor(this, scene.time); +784 if ( scene.onRenderEnd ) { +785 scene.onRenderEnd(scene.time); +786 } +787 this.worldModelViewMatrix = matwmv; +788 +789 ctx.restore(); +790 +791 this.ctx = octx; +792 this.crc = ocrc; +793 } +794 }, +795 /** +796 * Add a new Scene to Director's Scene list. By adding a Scene to the Director +797 * does not mean it will be immediately visible, you should explicitly call either +798 * <ul> +799 * <li>easeIn +800 * <li>easeInOut +801 * <li>easeInOutRandom +802 * <li>setScene +803 * <li>or any of the scene switching methods +804 * </ul> +805 * +806 * @param scene {CAAT.Scene} an CAAT.Scene object. +807 */ +808 addScene : function(scene) { +809 scene.setBounds(0, 0, this.width, this.height); +810 this.scenes.push(scene); +811 scene.setEaseListener(this); +812 if (null === this.currentScene) { +813 this.setScene(0); +814 } +815 }, +816 /** +817 * Get the number of scenes contained in the Director. +818 * @return {number} the number of scenes contained in the Director. +819 */ +820 getNumScenes : function() { +821 return this.scenes.length; +822 }, +823 /** +824 * This method offers full control over the process of switching between any given two Scenes. +825 * To apply this method, you must specify the type of transition to apply for each Scene and +826 * the anchor to keep the Scene pinned at. +827 * <p> +828 * The type of transition will be one of the following values defined in CAAT.Scene.prototype: +829 * <ul> +830 * <li>EASE_ROTATION +831 * <li>EASE_SCALE +832 * <li>EASE_TRANSLATION +833 * </ul> +834 * +835 * <p> +836 * The anchor will be any of these values defined in CAAT.Actor.prototype: +837 * <ul> +838 * <li>ANCHOR_CENTER +839 * <li>ANCHOR_TOP +840 * <li>ANCHOR_BOTTOM +841 * <li>ANCHOR_LEFT +842 * <li>ANCHOR_RIGHT +843 * <li>ANCHOR_TOP_LEFT +844 * <li>ANCHOR_TOP_RIGHT +845 * <li>ANCHOR_BOTTOM_LEFT +846 * <li>ANCHOR_BOTTOM_RIGHT +847 * </ul> +848 * +849 * <p> +850 * In example, for an entering scene performing a EASE_SCALE transition, the anchor is the +851 * point by which the scene will scaled. +852 * +853 * @param inSceneIndex integer indicating the Scene index to bring in to the Director. +854 * @param typein integer indicating the type of transition to apply to the bringing in Scene. +855 * @param anchorin integer indicating the anchor of the bringing in Scene. +856 * @param outSceneIndex integer indicating the Scene index to take away from the Director. +857 * @param typeout integer indicating the type of transition to apply to the taking away in Scene. +858 * @param anchorout integer indicating the anchor of the taking away Scene. +859 * @param time inteter indicating the time to perform the process of switchihg between Scene object +860 * in milliseconds. +861 * @param alpha boolean boolean indicating whether alpha transparency fading will be applied to +862 * the scenes. +863 * @param interpolatorIn CAAT.Interpolator object to apply to entering scene. +864 * @param interpolatorOut CAAT.Interpolator object to apply to exiting scene. +865 */ +866 easeInOut : function(inSceneIndex, typein, anchorin, outSceneIndex, typeout, anchorout, time, alpha, interpolatorIn, interpolatorOut) { +867 +868 if (inSceneIndex === this.getCurrentSceneIndex()) { +869 return; +870 } +871 +872 var ssin = this.scenes[ inSceneIndex ]; +873 var sout = this.scenes[ outSceneIndex ]; +874 +875 if (!this.glEnabled && !navigator.browser==='iOS') { +876 this.worldModelViewMatrix.transformRenderingContext(this.transitionScene.ctx); +877 this.renderToContext(this.transitionScene.ctx, sout); +878 sout = this.transitionScene; +879 } +880 +881 ssin.setExpired(false); +882 sout.setExpired(false); +883 +884 ssin.mouseEnabled = false; +885 sout.mouseEnabled = false; +886 +887 ssin.resetTransform(); +888 sout.resetTransform(); +889 +890 ssin.setLocation(0, 0); +891 sout.setLocation(0, 0); +892 +893 ssin.alpha = 1; +894 sout.alpha = 1; +895 +896 if (typein === CAAT.Scene.prototype.EASE_ROTATION) { +897 ssin.easeRotationIn(time, alpha, anchorin, interpolatorIn); +898 } else if (typein === CAAT.Scene.prototype.EASE_SCALE) { +899 ssin.easeScaleIn(0, time, alpha, anchorin, interpolatorIn); +900 } else { +901 ssin.easeTranslationIn(time, alpha, anchorin, interpolatorIn); +902 } +903 +904 if (typeout === CAAT.Scene.prototype.EASE_ROTATION) { +905 sout.easeRotationOut(time, alpha, anchorout, interpolatorOut); +906 } else if (typeout === CAAT.Scene.prototype.EASE_SCALE) { +907 sout.easeScaleOut(0, time, alpha, anchorout, interpolatorOut); +908 } else { +909 sout.easeTranslationOut(time, alpha, anchorout, interpolatorOut); +910 } +911 +912 this.childrenList = []; +913 +914 this.addChild(sout); +915 this.addChild(ssin); +916 }, +917 /** +918 * This method will switch between two given Scene indexes (ie, take away scene number 2, +919 * and bring in scene number 5). +920 * <p> +921 * It will randomly choose for each Scene the type of transition to apply and the anchor +922 * point of each transition type. +923 * <p> +924 * It will also set for different kind of transitions the following interpolators: +925 * <ul> +926 * <li>EASE_ROTATION -> ExponentialInOutInterpolator, exponent 4. +927 * <li>EASE_SCALE -> ElasticOutInterpolator, 1.1 and .4 +928 * <li>EASE_TRANSLATION -> BounceOutInterpolator +929 * </ul> +930 * +931 * <p> +932 * These are the default values, and could not be changed by now. +933 * This method in final instance delegates the process to easeInOutMethod. +934 * +935 * @see easeInOutMethod. +936 * +937 * @param inIndex integer indicating the entering scene index. +938 * @param outIndex integer indicating the exiting scene index. +939 * @param time integer indicating the time to take for the process of Scene in/out in milliseconds. +940 * @param alpha boolean indicating whether alpha transparency fading should be applied to transitions. +941 */ +942 easeInOutRandom : function(inIndex, outIndex, time, alpha) { +943 +944 var pin = Math.random(); +945 var pout = Math.random(); +946 +947 var typeIn; +948 var interpolatorIn; +949 +950 if (pin < 0.33) { +951 typeIn = CAAT.Scene.prototype.EASE_ROTATION; +952 interpolatorIn = new CAAT.Interpolator().createExponentialInOutInterpolator(4); +953 } else if (pin < 0.66) { +954 typeIn = CAAT.Scene.prototype.EASE_SCALE; +955 interpolatorIn = new CAAT.Interpolator().createElasticOutInterpolator(1.1, 0.4); +956 } else { +957 typeIn = CAAT.Scene.prototype.EASE_TRANSLATE; +958 interpolatorIn = new CAAT.Interpolator().createBounceOutInterpolator(); +959 } +960 +961 var typeOut; +962 var interpolatorOut; +963 +964 if (pout < 0.33) { +965 typeOut = CAAT.Scene.prototype.EASE_ROTATION; +966 interpolatorOut = new CAAT.Interpolator().createExponentialInOutInterpolator(4); +967 } else if (pout < 0.66) { +968 typeOut = CAAT.Scene.prototype.EASE_SCALE; +969 interpolatorOut = new CAAT.Interpolator().createExponentialOutInterpolator(4); +970 } else { +971 typeOut = CAAT.Scene.prototype.EASE_TRANSLATE; +972 interpolatorOut = new CAAT.Interpolator().createBounceOutInterpolator(); 973 } 974 -975 if (!transition) { -976 this.setScene(currentSceneIndex - 1); -977 } -978 else { -979 this.easeInOutRandom(currentSceneIndex - 1, currentSceneIndex, time, alpha); -980 } -981 }, -982 /** -983 * Sets the previous Scene in sequence as the current Scene. -984 * @see switchToScene. -985 * -986 * @param time {number} integer indicating the time the Scene transition will take. -987 * @param alpha {boolean} a boolean indicating whether Scene transition should be fading. -988 * @param transition {boolean} a boolean indicating whether the scene change must smoothly animated. -989 */ -990 switchToNextScene: function(time, alpha, transition) { -991 -992 var currentSceneIndex = this.getSceneIndex(this.currentScene); -993 -994 if (this.getNumScenes() <= 1 || currentSceneIndex === this.getNumScenes() - 1) { -995 return; -996 } -997 -998 if (!transition) { -999 this.setScene(currentSceneIndex + 1); -1000 } -1001 else { -1002 this.easeInOutRandom(currentSceneIndex + 1, currentSceneIndex, time, alpha); -1003 } -1004 }, -1005 mouseEnter : function(mouseEvent) { -1006 }, -1007 mouseExit : function(mouseEvent) { -1008 }, -1009 mouseMove : function(mouseEvent) { -1010 }, -1011 mouseDown : function(mouseEvent) { -1012 }, -1013 mouseUp : function(mouseEvent) { -1014 }, -1015 mouseDrag : function(mouseEvent) { -1016 }, -1017 /** -1018 * Scene easing listener. Notifies scenes when they're about to be activated (set as current -1019 * director's scene). -1020 * -1021 * @param scene {CAAT.Scene} the scene that has just been brought in or taken out of the director. -1022 * @param b_easeIn {boolean} scene enters or exits ? -1023 */ -1024 easeEnd : function(scene, b_easeIn) { -1025 // scene is going out -1026 if (!b_easeIn) { -1027 -1028 scene.setExpired(true); -1029 } else { -1030 this.currentScene = scene; -1031 this.currentScene.activated(); -1032 } -1033 -1034 scene.mouseEnabled = true; -1035 scene.emptyBehaviorList(); -1036 }, -1037 /** -1038 * Return the index for a given Scene object contained in the Director. -1039 * @param scene {CAAT.Scene} -1040 */ -1041 getSceneIndex : function(scene) { -1042 for (var i = 0; i < this.scenes.length; i++) { -1043 if (this.scenes[i] === scene) { -1044 return i; -1045 } -1046 } -1047 return -1; +975 this.easeInOut( +976 inIndex, +977 typeIn, +978 (Math.random() * 8.99) >> 0, +979 +980 outIndex, +981 typeOut, +982 (Math.random() * 8.99) >> 0, +983 +984 time, +985 alpha, +986 +987 interpolatorIn, +988 interpolatorOut); +989 +990 }, +991 /** +992 * This method changes Director's current Scene to the scene index indicated by +993 * inSceneIndex parameter. The Scene running in the director won't be eased out. +994 * +995 * @see {CAAT.Interpolator} +996 * @see {CAAT.Actor} +997 * @see {CAAT.Scene} +998 * +999 * @param inSceneIndex integer indicating the new Scene to set as current. +1000 * @param type integer indicating the type of transition to apply to bring the new current +1001 * Scene to the Director. The values will be one of: CAAT.Scene.prototype.EASE_ROTATION, +1002 * CAAT.Scene.prototype.EASE_SCALE, CAAT.Scene.prototype.EASE_TRANSLATION. +1003 * @param time integer indicating how much time in milliseconds the Scene entrance will take. +1004 * @param alpha boolean indicating whether alpha transparency fading will be applied to the +1005 * entereing Scene. +1006 * @param anchor integer indicating the anchor to fix for Scene transition. It will be any of +1007 * CAAT.Actor.prototype.ANCHOR_* values. +1008 * @param interpolator an CAAT.Interpolator object indicating the interpolation function to +1009 * apply. +1010 */ +1011 easeIn : function(inSceneIndex, type, time, alpha, anchor, interpolator) { +1012 var sin = this.scenes[ inSceneIndex ]; +1013 if (type === CAAT.Scene.prototype.EASE_ROTATION) { +1014 sin.easeRotationIn(time, alpha, anchor, interpolator); +1015 } else if (type === CAAT.Scene.prototype.EASE_SCALE) { +1016 sin.easeScaleIn(0, time, alpha, anchor, interpolator); +1017 } else { +1018 sin.easeTranslationIn(time, alpha, anchor, interpolator); +1019 } +1020 this.childrenList = []; +1021 this.addChild(sin); +1022 +1023 sin.resetTransform(); +1024 sin.setLocation(0, 0); +1025 sin.alpha = 1; +1026 sin.mouseEnabled = false; +1027 sin.setExpired(false); +1028 }, +1029 /** +1030 * Changes (or sets) the current Director scene to the index +1031 * parameter. There will be no transition on scene change. +1032 * @param sceneIndex {number} an integer indicating the index of the target Scene +1033 * to be shown. +1034 */ +1035 setScene : function(sceneIndex) { +1036 var sin = this.scenes[ sceneIndex ]; +1037 this.childrenList = []; +1038 this.addChild(sin); +1039 this.currentScene = sin; +1040 +1041 sin.setExpired(false); +1042 sin.mouseEnabled = true; +1043 sin.resetTransform(); +1044 sin.setLocation(0, 0); +1045 sin.alpha = 1; +1046 +1047 sin.activated(); 1048 }, 1049 /** -1050 * Get a concrete director's scene. -1051 * @param index {number} an integer indicating the scene index. -1052 * @return {CAAT.Scene} a CAAT.Scene object instance or null if the index is oob. -1053 */ -1054 getScene : function(index) { -1055 return this.scenes[index]; -1056 }, -1057 /** -1058 * Return the index of the current scene in the Director's scene list. -1059 * @return {number} the current scene's index. -1060 */ -1061 getCurrentSceneIndex : function() { -1062 return this.getSceneIndex(this.currentScene); -1063 }, -1064 /** -1065 * Return the running browser name. -1066 * @return {string} the browser name. -1067 */ -1068 getBrowserName : function() { -1069 return this.browserInfo.browser; -1070 }, -1071 /** -1072 * Return the running browser version. -1073 * @return {string} the browser version. -1074 */ -1075 getBrowserVersion : function() { -1076 return this.browserInfo.version; -1077 }, -1078 /** -1079 * Return the operating system name. -1080 * @return {string} the os name. -1081 */ -1082 getOSName : function() { -1083 return this.browserInfo.OS; -1084 }, -1085 /** -1086 * Gets the resource with the specified resource name. -1087 * The Director holds a collection called <code>imagesCache</code> -1088 * where you can store a JSON of the form -1089 * <code>[ { id: imageId, image: imageObject } ]</code>. -1090 * This structure will be used as a resources cache. -1091 * There's a CAAT.ImagePreloader class to preload resources and -1092 * generate this structure on loading finalization. -1093 * -1094 * @param sId {object} an String identifying a resource. -1095 */ -1096 getImage : function(sId) { -1097 var ret = this.imagesCache[sId]; -1098 if (ret) { -1099 return ret; -1100 } +1050 * This method will change the current Scene by the Scene indicated as parameter. +1051 * It will apply random values for anchor and transition type. +1052 * @see easeInOutRandom +1053 * +1054 * @param iNewSceneIndex {number} an integer indicating the index of the new scene to run on the Director. +1055 * @param time {number} an integer indicating the time the Scene transition will take. +1056 * @param alpha {boolean} a boolean indicating whether Scene transition should be fading. +1057 * @param transition {boolean} a boolean indicating whether the scene change must smoothly animated. +1058 */ +1059 switchToScene : function(iNewSceneIndex, time, alpha, transition) { +1060 var currentSceneIndex = this.getSceneIndex(this.currentScene); +1061 +1062 if (!transition) { +1063 this.setScene(iNewSceneIndex); +1064 } +1065 else { +1066 this.easeInOutRandom(iNewSceneIndex, currentSceneIndex, time, alpha); +1067 } +1068 }, +1069 /** +1070 * Sets the previous Scene in sequence as the current Scene. +1071 * @see switchToScene. +1072 * +1073 * @param time {number} integer indicating the time the Scene transition will take. +1074 * @param alpha {boolean} a boolean indicating whether Scene transition should be fading. +1075 * @param transition {boolean} a boolean indicating whether the scene change must smoothly animated. +1076 */ +1077 switchToPrevScene : function(time, alpha, transition) { +1078 +1079 var currentSceneIndex = this.getSceneIndex(this.currentScene); +1080 +1081 if (this.getNumScenes() <= 1 || currentSceneIndex === 0) { +1082 return; +1083 } +1084 +1085 if (!transition) { +1086 this.setScene(currentSceneIndex - 1); +1087 } +1088 else { +1089 this.easeInOutRandom(currentSceneIndex - 1, currentSceneIndex, time, alpha); +1090 } +1091 }, +1092 /** +1093 * Sets the previous Scene in sequence as the current Scene. +1094 * @see switchToScene. +1095 * +1096 * @param time {number} integer indicating the time the Scene transition will take. +1097 * @param alpha {boolean} a boolean indicating whether Scene transition should be fading. +1098 * @param transition {boolean} a boolean indicating whether the scene change must smoothly animated. +1099 */ +1100 switchToNextScene: function(time, alpha, transition) { 1101 -1102 for (var i = 0; i < this.imagesCache.length; i++) { -1103 if (this.imagesCache[i].id === sId) { -1104 return this.imagesCache[i].image; -1105 } +1102 var currentSceneIndex = this.getSceneIndex(this.currentScene); +1103 +1104 if (this.getNumScenes() <= 1 || currentSceneIndex === this.getNumScenes() - 1) { +1105 return; 1106 } 1107 -1108 return null; -1109 }, -1110 /** -1111 * Adds an audio to the cache. -1112 * -1113 * @see CAAT.AudioManager.addAudio -1114 * @return this -1115 */ -1116 addAudio : function(id, url) { -1117 this.audioManager.addAudio(id, url); -1118 return this; -1119 }, -1120 /** -1121 * Plays the audio instance identified by the id. -1122 * @param id {object} the object used to store a sound in the audioCache. -1123 */ -1124 audioPlay : function(id) { -1125 this.audioManager.play(id); +1108 if (!transition) { +1109 this.setScene(currentSceneIndex + 1); +1110 } +1111 else { +1112 this.easeInOutRandom(currentSceneIndex + 1, currentSceneIndex, time, alpha); +1113 } +1114 }, +1115 mouseEnter : function(mouseEvent) { +1116 }, +1117 mouseExit : function(mouseEvent) { +1118 }, +1119 mouseMove : function(mouseEvent) { +1120 }, +1121 mouseDown : function(mouseEvent) { +1122 }, +1123 mouseUp : function(mouseEvent) { +1124 }, +1125 mouseDrag : function(mouseEvent) { 1126 }, 1127 /** -1128 * Loops an audio instance identified by the id. -1129 * @param id {object} the object used to store a sound in the audioCache. +1128 * Scene easing listener. Notifies scenes when they're about to be activated (set as current +1129 * director's scene). 1130 * -1131 * @return {HTMLElement|null} the value from audioManager.loop -1132 */ -1133 audioLoop : function(id) { -1134 return this.audioManager.loop(id); -1135 }, -1136 endSound : function() { -1137 return this.audioManager.endSound(); -1138 }, -1139 setSoundEffectsEnabled : function(enabled) { -1140 return this.audioManager.setSoundEffectsEnabled(enabled); -1141 }, -1142 setMusicEnabled : function(enabled) { -1143 return this.audioManager.setMusicEnabled(enabled); -1144 }, -1145 isMusicEnabled : function() { -1146 return this.audioManager.isMusicEnabled(); -1147 }, -1148 isSoundEffectsEnabled : function() { -1149 return this.audioManager.isSoundEffectsEnabled(); -1150 }, -1151 /** -1152 * Removes Director's scenes. -1153 */ -1154 emptyScenes : function() { -1155 this.scenes = []; -1156 }, -1157 /** -1158 * Adds an scene to this Director. -1159 * @param scene {CAAT.Scene} a scene object. -1160 */ -1161 addChild : function(scene) { -1162 scene.parent = this; -1163 this.childrenList.push(scene); -1164 }, -1165 /** -1166 * @Deprecated use CAAT.loop instead. -1167 * @param fps -1168 * @param callback -1169 * @param callback2 +1131 * @param scene {CAAT.Scene} the scene that has just been brought in or taken out of the director. +1132 * @param b_easeIn {boolean} scene enters or exits ? +1133 */ +1134 easeEnd : function(scene, b_easeIn) { +1135 // scene is going out +1136 if (!b_easeIn) { +1137 +1138 scene.setExpired(true); +1139 } else { +1140 this.currentScene = scene; +1141 this.currentScene.activated(); +1142 } +1143 +1144 scene.mouseEnabled = true; +1145 scene.emptyBehaviorList(); +1146 }, +1147 /** +1148 * Return the index for a given Scene object contained in the Director. +1149 * @param scene {CAAT.Scene} +1150 */ +1151 getSceneIndex : function(scene) { +1152 for (var i = 0; i < this.scenes.length; i++) { +1153 if (this.scenes[i] === scene) { +1154 return i; +1155 } +1156 } +1157 return -1; +1158 }, +1159 /** +1160 * Get a concrete director's scene. +1161 * @param index {number} an integer indicating the scene index. +1162 * @return {CAAT.Scene} a CAAT.Scene object instance or null if the index is oob. +1163 */ +1164 getScene : function(index) { +1165 return this.scenes[index]; +1166 }, +1167 /** +1168 * Return the index of the current scene in the Director's scene list. +1169 * @return {number} the current scene's index. 1170 */ -1171 loop : function(fps,callback,callback2) { -1172 if ( callback2 ) { -1173 this.onRenderStart= callback; -1174 this.onRenderEnd= callback2; -1175 } else if (callback) { -1176 this.onRenderEnd= callback; -1177 } -1178 CAAT.loop(); -1179 }, -1180 /** -1181 * Starts the director animation.If no scene is explicitly selected, the current Scene will -1182 * be the first scene added to the Director. -1183 * <p> -1184 * The fps parameter will set the animation quality. Higher values, -1185 * means CAAT will try to render more frames in the same second (at the -1186 * expense of cpu power at least until hardware accelerated canvas rendering -1187 * context are available). A value of 60 is a high frame rate and should not be exceeded. -1188 * -1189 * @param fps {number} integer value indicating the target frames per second to run -1190 * the animation at. +1171 getCurrentSceneIndex : function() { +1172 return this.getSceneIndex(this.currentScene); +1173 }, +1174 /** +1175 * Return the running browser name. +1176 * @return {string} the browser name. +1177 */ +1178 getBrowserName : function() { +1179 return this.browserInfo.browser; +1180 }, +1181 /** +1182 * Return the running browser version. +1183 * @return {string} the browser version. +1184 */ +1185 getBrowserVersion : function() { +1186 return this.browserInfo.version; +1187 }, +1188 /** +1189 * Return the operating system name. +1190 * @return {string} the os name. 1191 */ -1192 renderFrame : function(fps, callback) { -1193 var t = new Date().getTime(), -1194 delta = t - this.timeline; -1195 -1196 /* -1197 check for massive frame time. if for example the current browser tab is minified or taken out of -1198 foreground, the system will account for a bit time interval. minify that impact by lowering down -1199 the elapsed time (virtual timelines FTW) -1200 */ -1201 if ( delta > 500 ) { -1202 delta= 500; -1203 } -1204 -1205 if ( this.onRenderStart ) { -1206 this.onRenderStart(delta); -1207 } -1208 -1209 this.render(delta); -1210 -1211 if ( this.debugInfo ) { -1212 this.debugInfo(this.statistics); -1213 } -1214 -1215 this.timeline = t; -1216 -1217 if (this.onRenderEnd) { -1218 this.onRenderEnd(delta); -1219 } -1220 }, -1221 endLoop : function () { -1222 }, -1223 /** -1224 * This method states whether the director must clear background before rendering -1225 * each frame. -1226 * @param clear {boolean} a boolean indicating whether to clear the screen before scene draw. -1227 * @return this. -1228 */ -1229 setClear : function(clear) { -1230 this.clear = clear; -1231 return this; -1232 }, -1233 /** -1234 * Get this Director's AudioManager instance. -1235 * @return {CAAT.AudioManager} the AudioManager instance. -1236 */ -1237 getAudioManager : function() { -1238 return this.audioManager; -1239 }, -1240 /** -1241 * Acculumate dom elements position to properly offset on-screen mouse/touch events. -1242 * @param node -1243 */ -1244 cumulateOffset : function(node, parent, prop) { -1245 var left= prop+'Left'; -1246 var top= prop+'Top'; -1247 var x=0, y=0, style; -1248 -1249 while( navigator.browser!=='iOS' && node && node.style ) { -1250 if ( node.currentStyle ) { -1251 style= node.currentStyle['position']; -1252 } else { -1253 style= (node.ownerDocument.defaultView || node.ownerDocument.parentWindow).getComputedStyle(node, null); -1254 style= style ? style.getPropertyValue('position') : null; -1255 } -1256 -1257 // if (!/^(relative|absolute|fixed)$/.test(style)) { -1258 if (!/^(fixed)$/.test(style)) { -1259 x += node[left]; -1260 y+= node[top]; -1261 node = node[parent]; -1262 } else { -1263 break; -1264 } -1265 } -1266 -1267 return { -1268 x: x, -1269 y: y, -1270 style: style -1271 }; -1272 }, -1273 getOffset : function( node ) { -1274 var res= this.cumulateOffset(node, 'offsetParent', 'offset'); -1275 if ( res.style==='fixed' ) { -1276 var res2= this.cumulateOffset(node, node.parentNode ? 'parentNode' : 'parentElement', 'scroll'); -1277 return { -1278 x: res.x + res2.x, -1279 y: res.y + res2.y -1280 }; -1281 } -1282 -1283 return { -1284 x: res.x, -1285 y: res.y -1286 }; -1287 }, -1288 /** -1289 * Normalize input event coordinates to be related to (0,0) canvas position. -1290 * @param point {CAAT.Point} a CAAT.Point instance to hold the canvas coordinate. -1291 * @param e {MouseEvent} a mouse event from an input event. -1292 */ -1293 getCanvasCoord : function(point, e) { -1294 -1295 var posx = 0; -1296 var posy = 0; -1297 if (!e) e = window.event; -1298 -1299 if (e.pageX || e.pageY) { -1300 posx = e.pageX; -1301 posy = e.pageY; -1302 } -1303 else if (e.clientX || e.clientY) { -1304 posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; -1305 posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop; -1306 } -1307 -1308 var offset= this.getOffset(e.target); -1309 -1310 posx-= offset.x; -1311 posy-= offset.y; -1312 -1313 ////////////// -1314 // transformar coordenada inversamente con affine transform de director. -1315 -1316 var pt= new CAAT.Point( posx, posy ); -1317 this.modelViewMatrixI= this.modelViewMatrix.getInverse(); -1318 this.modelViewMatrixI.transformCoord(pt); -1319 posx= pt.x; -1320 posy= pt.y -1321 -1322 point.set(posx, posy); -1323 this.screenMousePoint.set(posx, posy); -1324 -1325 }, +1192 getOSName : function() { +1193 return this.browserInfo.OS; +1194 }, +1195 /** +1196 * Gets the resource with the specified resource name. +1197 * The Director holds a collection called <code>imagesCache</code> +1198 * where you can store a JSON of the form +1199 * <code>[ { id: imageId, image: imageObject } ]</code>. +1200 * This structure will be used as a resources cache. +1201 * There's a CAAT.ImagePreloader class to preload resources and +1202 * generate this structure on loading finalization. +1203 * +1204 * @param sId {object} an String identifying a resource. +1205 */ +1206 getImage : function(sId) { +1207 var ret = this.imagesCache[sId]; +1208 if (ret) { +1209 return ret; +1210 } +1211 +1212 for (var i = 0; i < this.imagesCache.length; i++) { +1213 if (this.imagesCache[i].id === sId) { +1214 return this.imagesCache[i].image; +1215 } +1216 } +1217 +1218 return null; +1219 }, +1220 /** +1221 * Adds an audio to the cache. +1222 * +1223 * @see CAAT.AudioManager.addAudio +1224 * @return this +1225 */ +1226 addAudio : function(id, url) { +1227 this.audioManager.addAudio(id, url); +1228 return this; +1229 }, +1230 /** +1231 * Plays the audio instance identified by the id. +1232 * @param id {object} the object used to store a sound in the audioCache. +1233 */ +1234 audioPlay : function(id) { +1235 this.audioManager.play(id); +1236 }, +1237 /** +1238 * Loops an audio instance identified by the id. +1239 * @param id {object} the object used to store a sound in the audioCache. +1240 * +1241 * @return {HTMLElement|null} the value from audioManager.loop +1242 */ +1243 audioLoop : function(id) { +1244 return this.audioManager.loop(id); +1245 }, +1246 endSound : function() { +1247 return this.audioManager.endSound(); +1248 }, +1249 setSoundEffectsEnabled : function(enabled) { +1250 return this.audioManager.setSoundEffectsEnabled(enabled); +1251 }, +1252 setMusicEnabled : function(enabled) { +1253 return this.audioManager.setMusicEnabled(enabled); +1254 }, +1255 isMusicEnabled : function() { +1256 return this.audioManager.isMusicEnabled(); +1257 }, +1258 isSoundEffectsEnabled : function() { +1259 return this.audioManager.isSoundEffectsEnabled(); +1260 }, +1261 /** +1262 * Removes Director's scenes. +1263 */ +1264 emptyScenes : function() { +1265 this.scenes = []; +1266 }, +1267 /** +1268 * Adds an scene to this Director. +1269 * @param scene {CAAT.Scene} a scene object. +1270 */ +1271 addChild : function(scene) { +1272 scene.parent = this; +1273 this.childrenList.push(scene); +1274 }, +1275 /** +1276 * @Deprecated use CAAT.loop instead. +1277 * @param fps +1278 * @param callback +1279 * @param callback2 +1280 */ +1281 loop : function(fps,callback,callback2) { +1282 if ( callback2 ) { +1283 this.onRenderStart= callback; +1284 this.onRenderEnd= callback2; +1285 } else if (callback) { +1286 this.onRenderEnd= callback; +1287 } +1288 CAAT.loop(); +1289 }, +1290 /** +1291 * Starts the director animation.If no scene is explicitly selected, the current Scene will +1292 * be the first scene added to the Director. +1293 * <p> +1294 * The fps parameter will set the animation quality. Higher values, +1295 * means CAAT will try to render more frames in the same second (at the +1296 * expense of cpu power at least until hardware accelerated canvas rendering +1297 * context are available). A value of 60 is a high frame rate and should not be exceeded. +1298 * +1299 * @param fps {number} integer value indicating the target frames per second to run +1300 * the animation at. +1301 */ +1302 renderFrame : function(fps, callback) { +1303 var t = new Date().getTime(), +1304 delta = t - this.timeline; +1305 +1306 /* +1307 check for massive frame time. if for example the current browser tab is minified or taken out of +1308 foreground, the system will account for a bit time interval. minify that impact by lowering down +1309 the elapsed time (virtual timelines FTW) +1310 */ +1311 if ( delta > 500 ) { +1312 delta= 500; +1313 } +1314 +1315 if ( this.onRenderStart ) { +1316 this.onRenderStart(delta); +1317 } +1318 +1319 this.render(delta); +1320 +1321 if ( this.debugInfo ) { +1322 this.debugInfo(this.statistics); +1323 } +1324 +1325 this.timeline = t; 1326 -1327 __mouseDownHandler : function(e) { -1328 -1329 /* -1330 was dragging and mousedown detected, can only mean a mouseOut's been performed and on mouseOver, no -1331 button was presses. Then, send a mouseUp for the previos actor, and return; -1332 */ -1333 if ( this.dragging && this.lastSelectedActor ) { -1334 this.__mouseUpHandler(e); -1335 return; -1336 } -1337 -1338 this.getCanvasCoord(this.mousePoint, e); -1339 this.isMouseDown = true; -1340 var lactor = this.findActorAtPosition(this.mousePoint); -1341 -1342 if (null !== lactor) { -1343 -1344 var pos = lactor.viewToModel( -1345 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); -1346 -1347 lactor.mouseDown( -1348 new CAAT.MouseEvent().init( -1349 pos.x, -1350 pos.y, -1351 e, -1352 lactor, -1353 new CAAT.Point( -1354 this.screenMousePoint.x, -1355 this.screenMousePoint.y ))); -1356 } -1357 -1358 this.lastSelectedActor= lactor; +1327 if (this.onRenderEnd) { +1328 this.onRenderEnd(delta); +1329 } +1330 }, +1331 endLoop : function () { +1332 }, +1333 /** +1334 * This method states whether the director must clear background before rendering +1335 * each frame. +1336 * +1337 * The clearing method could be: +1338 * + CAAT.Director.CLEAR_ALL. previous to draw anything on screen the canvas will have clearRect called on it. +1339 * + CAAT.Director.CLEAR_DIRTY_RECTS. Actors marked as invalid, or which have been moved, rotated or scaled +1340 * will have their areas redrawn. +1341 * + CAAT.Director.CLEAR_NONE. clears nothing. +1342 * +1343 * @param clear {CAAT.Director.CLEAR_ALL |�CAAT.Director.CLEAR_NONE | CAAT.Director.CLEAR_DIRTY_RECTS} +1344 * @return this. +1345 */ +1346 setClear : function(clear) { +1347 this.clear = clear; +1348 if ( this.clear===CAAT.Director.CLEAR_DIRTY_RECTS ) { +1349 this.dirtyRectsEnabled= true; +1350 } +1351 return this; +1352 }, +1353 /** +1354 * Get this Director's AudioManager instance. +1355 * @return {CAAT.AudioManager} the AudioManager instance. +1356 */ +1357 getAudioManager : function() { +1358 return this.audioManager; 1359 }, -1360 -1361 __mouseUpHandler : function(e) { -1362 -1363 this.isMouseDown = false; -1364 this.getCanvasCoord(this.mousePoint, e); -1365 -1366 var pos= null; -1367 var lactor= this.lastSelectedActor; +1360 /** +1361 * Acculumate dom elements position to properly offset on-screen mouse/touch events. +1362 * @param node +1363 */ +1364 cumulateOffset : function(node, parent, prop) { +1365 var left= prop+'Left'; +1366 var top= prop+'Top'; +1367 var x=0, y=0, style; 1368 -1369 if (null !== lactor) { -1370 pos = lactor.viewToModel( -1371 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); -1372 if ( lactor.actionPerformed && lactor.contains(pos.x, pos.y) ) { -1373 lactor.actionPerformed(e) -1374 } -1375 -1376 lactor.mouseUp( -1377 new CAAT.MouseEvent().init( -1378 pos.x, -1379 pos.y, -1380 e, -1381 lactor, -1382 this.screenMousePoint, -1383 this.currentScene.time)); -1384 } -1385 -1386 if (!this.dragging && null !== lactor) { -1387 if (lactor.contains(pos.x, pos.y)) { -1388 lactor.mouseClick( -1389 new CAAT.MouseEvent().init( -1390 pos.x, -1391 pos.y, -1392 e, -1393 lactor, -1394 this.screenMousePoint, -1395 this.currentScene.time)); -1396 } -1397 } -1398 -1399 this.dragging = false; -1400 this.in_= false; -1401 // CAAT.setCursor('default'); -1402 }, -1403 -1404 __mouseMoveHandler : function(e) { -1405 this.getCanvasCoord(this.mousePoint, e); -1406 -1407 var lactor; -1408 var pos; -1409 -1410 // drag -1411 -1412 if (this.isMouseDown && null !== this.lastSelectedActor) { -1413 /* -1414 // check for mouse move threshold. -1415 if (!this.dragging) { -1416 if (Math.abs(this.prevMousePoint.x - this.mousePoint.x) < CAAT.DRAG_THRESHOLD_X && -1417 Math.abs(this.prevMousePoint.y - this.mousePoint.y) < CAAT.DRAG_THRESHOLD_Y) { -1418 return; -1419 } -1420 } -1421 */ -1422 -1423 -1424 lactor = this.lastSelectedActor; -1425 pos = lactor.viewToModel( -1426 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1369 while( navigator.browser!=='iOS' && node && node.style ) { +1370 if ( node.currentStyle ) { +1371 style= node.currentStyle['position']; +1372 } else { +1373 style= (node.ownerDocument.defaultView || node.ownerDocument.parentWindow).getComputedStyle(node, null); +1374 style= style ? style.getPropertyValue('position') : null; +1375 } +1376 +1377 // if (!/^(relative|absolute|fixed)$/.test(style)) { +1378 if (!/^(fixed)$/.test(style)) { +1379 x += node[left]; +1380 y+= node[top]; +1381 node = node[parent]; +1382 } else { +1383 break; +1384 } +1385 } +1386 +1387 return { +1388 x: x, +1389 y: y, +1390 style: style +1391 }; +1392 }, +1393 getOffset : function( node ) { +1394 var res= this.cumulateOffset(node, 'offsetParent', 'offset'); +1395 if ( res.style==='fixed' ) { +1396 var res2= this.cumulateOffset(node, node.parentNode ? 'parentNode' : 'parentElement', 'scroll'); +1397 return { +1398 x: res.x + res2.x, +1399 y: res.y + res2.y +1400 }; +1401 } +1402 +1403 return { +1404 x: res.x, +1405 y: res.y +1406 }; +1407 }, +1408 /** +1409 * Normalize input event coordinates to be related to (0,0) canvas position. +1410 * @param point {CAAT.Point} a CAAT.Point instance to hold the canvas coordinate. +1411 * @param e {MouseEvent} a mouse event from an input event. +1412 */ +1413 getCanvasCoord : function(point, e) { +1414 +1415 var posx = 0; +1416 var posy = 0; +1417 if (!e) e = window.event; +1418 +1419 if (e.pageX || e.pageY) { +1420 posx = e.pageX; +1421 posy = e.pageY; +1422 } +1423 else if (e.clientX || e.clientY) { +1424 posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; +1425 posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop; +1426 } 1427 -1428 this.dragging = true; +1428 var offset= this.getOffset(e.target); 1429 -1430 var px= lactor.x; -1431 var py= lactor.y; -1432 lactor.mouseDrag( -1433 new CAAT.MouseEvent().init( -1434 pos.x, -1435 pos.y, -1436 e, -1437 lactor, -1438 new CAAT.Point( -1439 this.screenMousePoint.x, -1440 this.screenMousePoint.y), -1441 this.currentScene.time)); -1442 -1443 this.prevMousePoint.x= pos.x; -1444 this.prevMousePoint.y= pos.y; -1445 -1446 /** -1447 * Element has not moved after drag, so treat it as a button. -1448 */ -1449 if ( px===lactor.x && py===lactor.y ) { -1450 -1451 var contains= lactor.contains(pos.x, pos.y); -1452 -1453 if (this.in_ && !contains) { -1454 lactor.mouseExit( -1455 new CAAT.MouseEvent().init( -1456 pos.x, -1457 pos.y, -1458 e, -1459 lactor, -1460 this.screenMousePoint, -1461 this.currentScene.time)); -1462 this.in_ = false; -1463 } -1464 -1465 if (!this.in_ && contains ) { -1466 lactor.mouseEnter( -1467 new CAAT.MouseEvent().init( -1468 pos.x, -1469 pos.y, -1470 e, -1471 lactor, -1472 this.screenMousePoint, -1473 this.currentScene.time)); -1474 this.in_ = true; -1475 } -1476 } +1430 posx-= offset.x; +1431 posy-= offset.y; +1432 +1433 ////////////// +1434 // transformar coordenada inversamente con affine transform de director. +1435 +1436 var pt= new CAAT.Point( posx, posy ); +1437 this.modelViewMatrixI= this.modelViewMatrix.getInverse(); +1438 this.modelViewMatrixI.transformCoord(pt); +1439 posx= pt.x; +1440 posy= pt.y +1441 +1442 point.set(posx, posy); +1443 this.screenMousePoint.set(posx, posy); +1444 +1445 }, +1446 +1447 __mouseDownHandler : function(e) { +1448 +1449 /* +1450 was dragging and mousedown detected, can only mean a mouseOut's been performed and on mouseOver, no +1451 button was presses. Then, send a mouseUp for the previos actor, and return; +1452 */ +1453 if ( this.dragging && this.lastSelectedActor ) { +1454 this.__mouseUpHandler(e); +1455 return; +1456 } +1457 +1458 this.getCanvasCoord(this.mousePoint, e); +1459 this.isMouseDown = true; +1460 var lactor = this.findActorAtPosition(this.mousePoint); +1461 +1462 if (null !== lactor) { +1463 +1464 var pos = lactor.viewToModel( +1465 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1466 +1467 lactor.mouseDown( +1468 new CAAT.MouseEvent().init( +1469 pos.x, +1470 pos.y, +1471 e, +1472 lactor, +1473 new CAAT.Point( +1474 this.screenMousePoint.x, +1475 this.screenMousePoint.y ))); +1476 } 1477 -1478 return; -1479 } +1478 this.lastSelectedActor= lactor; +1479 }, 1480 -1481 // mouse move. -1482 this.in_= true; -1483 -1484 lactor = this.findActorAtPosition(this.mousePoint); +1481 __mouseUpHandler : function(e) { +1482 +1483 this.isMouseDown = false; +1484 this.getCanvasCoord(this.mousePoint, e); 1485 -1486 // cambiamos de actor. -1487 if (lactor !== this.lastSelectedActor) { -1488 if (null !== this.lastSelectedActor) { -1489 -1490 pos = this.lastSelectedActor.viewToModel( -1491 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); -1492 -1493 this.lastSelectedActor.mouseExit( -1494 new CAAT.MouseEvent().init( -1495 pos.x, -1496 pos.y, -1497 e, -1498 this.lastSelectedActor, -1499 this.screenMousePoint, -1500 this.currentScene.time)); -1501 } -1502 -1503 if (null !== lactor) { -1504 pos = lactor.viewToModel( -1505 new CAAT.Point( this.screenMousePoint.x, this.screenMousePoint.y, 0)); -1506 -1507 lactor.mouseEnter( -1508 new CAAT.MouseEvent().init( -1509 pos.x, -1510 pos.y, -1511 e, -1512 lactor, -1513 this.screenMousePoint, -1514 this.currentScene.time)); -1515 } -1516 } -1517 -1518 pos = lactor.viewToModel( -1519 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); -1520 -1521 if (null !== lactor) { -1522 -1523 lactor.mouseMove( -1524 new CAAT.MouseEvent().init( -1525 pos.x, -1526 pos.y, -1527 e, -1528 lactor, -1529 this.screenMousePoint, -1530 this.currentScene.time)); -1531 } -1532 -1533 this.lastSelectedActor = lactor; -1534 }, -1535 -1536 __mouseOutHandler : function(e) { -1537 -1538 if (null !== this.lastSelectedActor ) { -1539 -1540 this.getCanvasCoord(this.mousePoint, e); -1541 var pos = new CAAT.Point(this.mousePoint.x, this.mousePoint.y, 0); -1542 this.lastSelectedActor.viewToModel(pos); +1486 var pos= null; +1487 var lactor= this.lastSelectedActor; +1488 +1489 if (null !== lactor) { +1490 pos = lactor.viewToModel( +1491 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1492 if ( lactor.actionPerformed && lactor.contains(pos.x, pos.y) ) { +1493 lactor.actionPerformed(e) +1494 } +1495 +1496 lactor.mouseUp( +1497 new CAAT.MouseEvent().init( +1498 pos.x, +1499 pos.y, +1500 e, +1501 lactor, +1502 this.screenMousePoint, +1503 this.currentScene.time)); +1504 } +1505 +1506 if (!this.dragging && null !== lactor) { +1507 if (lactor.contains(pos.x, pos.y)) { +1508 lactor.mouseClick( +1509 new CAAT.MouseEvent().init( +1510 pos.x, +1511 pos.y, +1512 e, +1513 lactor, +1514 this.screenMousePoint, +1515 this.currentScene.time)); +1516 } +1517 } +1518 +1519 this.dragging = false; +1520 this.in_= false; +1521 // CAAT.setCursor('default'); +1522 }, +1523 +1524 __mouseMoveHandler : function(e) { +1525 this.getCanvasCoord(this.mousePoint, e); +1526 +1527 var lactor; +1528 var pos; +1529 +1530 // drag +1531 +1532 if (this.isMouseDown && null !== this.lastSelectedActor) { +1533 /* +1534 // check for mouse move threshold. +1535 if (!this.dragging) { +1536 if (Math.abs(this.prevMousePoint.x - this.mousePoint.x) < CAAT.DRAG_THRESHOLD_X && +1537 Math.abs(this.prevMousePoint.y - this.mousePoint.y) < CAAT.DRAG_THRESHOLD_Y) { +1538 return; +1539 } +1540 } +1541 */ +1542 1543 -1544 var ev= new CAAT.MouseEvent().init( -1545 pos.x, -1546 pos.y, -1547 e, -1548 this.lastSelectedActor, -1549 this.screenMousePoint, -1550 this.currentScene.time); -1551 -1552 this.lastSelectedActor.mouseExit(ev); -1553 this.lastSelectedActor.mouseOut(ev); -1554 -1555 if ( !this.dragging ) { -1556 this.lastSelectedActor = null; -1557 } -1558 } else { -1559 this.isMouseDown = false; -1560 this.in_ = false; -1561 } +1544 lactor = this.lastSelectedActor; +1545 pos = lactor.viewToModel( +1546 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1547 +1548 this.dragging = true; +1549 +1550 var px= lactor.x; +1551 var py= lactor.y; +1552 lactor.mouseDrag( +1553 new CAAT.MouseEvent().init( +1554 pos.x, +1555 pos.y, +1556 e, +1557 lactor, +1558 new CAAT.Point( +1559 this.screenMousePoint.x, +1560 this.screenMousePoint.y), +1561 this.currentScene.time)); 1562 -1563 }, -1564 -1565 __mouseOverHandler : function(e) { -1566 -1567 var lactor; -1568 var pos, ev; -1569 this.getCanvasCoord(this.mousePoint, e); +1563 this.prevMousePoint.x= pos.x; +1564 this.prevMousePoint.y= pos.y; +1565 +1566 /** +1567 * Element has not moved after drag, so treat it as a button. +1568 */ +1569 if ( px===lactor.x && py===lactor.y ) { 1570 -1571 if ( null==this.lastSelectedActor ) { -1572 lactor= this.findActorAtPosition( this.mousePoint ); -1573 -1574 if (null !== lactor) { -1575 -1576 pos = lactor.viewToModel( -1577 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); -1578 -1579 ev= new CAAT.MouseEvent().init( -1580 pos.x, -1581 pos.y, -1582 e, -1583 lactor, -1584 this.screenMousePoint, -1585 this.currentScene.time); -1586 -1587 lactor.mouseOver(ev); -1588 lactor.mouseEnter(ev); -1589 } -1590 -1591 this.lastSelectedActor= lactor; -1592 } else { -1593 lactor= this.lastSelectedActor; -1594 pos = lactor.viewToModel( -1595 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); -1596 -1597 ev= new CAAT.MouseEvent().init( -1598 pos.x, -1599 pos.y, -1600 e, -1601 lactor, -1602 this.screenMousePoint, -1603 this.currentScene.time); -1604 -1605 lactor.mouseOver(ev); -1606 lactor.mouseEnter(ev); -1607 -1608 } -1609 }, -1610 -1611 __mouseDBLClickHandler : function(e) { +1571 var contains= lactor.contains(pos.x, pos.y); +1572 +1573 if (this.in_ && !contains) { +1574 lactor.mouseExit( +1575 new CAAT.MouseEvent().init( +1576 pos.x, +1577 pos.y, +1578 e, +1579 lactor, +1580 this.screenMousePoint, +1581 this.currentScene.time)); +1582 this.in_ = false; +1583 } +1584 +1585 if (!this.in_ && contains ) { +1586 lactor.mouseEnter( +1587 new CAAT.MouseEvent().init( +1588 pos.x, +1589 pos.y, +1590 e, +1591 lactor, +1592 this.screenMousePoint, +1593 this.currentScene.time)); +1594 this.in_ = true; +1595 } +1596 } +1597 +1598 return; +1599 } +1600 +1601 // mouse move. +1602 this.in_= true; +1603 +1604 lactor = this.findActorAtPosition(this.mousePoint); +1605 +1606 // cambiamos de actor. +1607 if (lactor !== this.lastSelectedActor) { +1608 if (null !== this.lastSelectedActor) { +1609 +1610 pos = this.lastSelectedActor.viewToModel( +1611 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); 1612 -1613 this.getCanvasCoord(this.mousePoint, e); -1614 if (null !== this.lastSelectedActor) { -1615 /* -1616 var pos = this.lastSelectedActor.viewToModel( -1617 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); -1618 */ -1619 this.lastSelectedActor.mouseDblClick( -1620 new CAAT.MouseEvent().init( -1621 this.mousePoint.x, -1622 this.mousePoint.y, -1623 e, -1624 this.lastSelectedActor, -1625 this.screenMousePoint, -1626 this.currentScene.time)); -1627 } -1628 }, -1629 -1630 /** -1631 * Same as mouseDown but not preventing event. -1632 * Will only take care of first touch. -1633 * @param e -1634 */ -1635 __touchStartHandler : function(e) { -1636 -1637 e.preventDefault(); -1638 e= e.targetTouches[0] -1639 this.__mouseDownHandler(e); -1640 }, -1641 -1642 __touchEndHandler : function(e) { -1643 -1644 e.preventDefault(); -1645 e= e.changedTouches[0]; -1646 this.__mouseUpHandler(e); -1647 }, -1648 -1649 __touchMoveHandler : function(e) { -1650 -1651 e.preventDefault(); +1613 this.lastSelectedActor.mouseExit( +1614 new CAAT.MouseEvent().init( +1615 pos.x, +1616 pos.y, +1617 e, +1618 this.lastSelectedActor, +1619 this.screenMousePoint, +1620 this.currentScene.time)); +1621 } +1622 +1623 if (null !== lactor) { +1624 pos = lactor.viewToModel( +1625 new CAAT.Point( this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1626 +1627 lactor.mouseEnter( +1628 new CAAT.MouseEvent().init( +1629 pos.x, +1630 pos.y, +1631 e, +1632 lactor, +1633 this.screenMousePoint, +1634 this.currentScene.time)); +1635 } +1636 } +1637 +1638 pos = lactor.viewToModel( +1639 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1640 +1641 if (null !== lactor) { +1642 +1643 lactor.mouseMove( +1644 new CAAT.MouseEvent().init( +1645 pos.x, +1646 pos.y, +1647 e, +1648 lactor, +1649 this.screenMousePoint, +1650 this.currentScene.time)); +1651 } 1652 -1653 if ( this.gesturing ) { -1654 return; -1655 } -1656 -1657 for( var i=0; i<e.targetTouches.length; i++ ) { -1658 if ( !i ) { -1659 this.__mouseMoveHandler(e.targetTouches[i]); -1660 } -1661 } -1662 }, +1653 this.lastSelectedActor = lactor; +1654 }, +1655 +1656 __mouseOutHandler : function(e) { +1657 +1658 if (null !== this.lastSelectedActor ) { +1659 +1660 this.getCanvasCoord(this.mousePoint, e); +1661 var pos = new CAAT.Point(this.mousePoint.x, this.mousePoint.y, 0); +1662 this.lastSelectedActor.viewToModel(pos); 1663 -1664 __gestureStart : function( scale, rotation ) { -1665 this.gesturing= true; -1666 this.__gestureRotation= this.lastSelectedActor.rotationAngle; -1667 this.__gestureSX= this.lastSelectedActor.scaleX - 1; -1668 this.__gestureSY= this.lastSelectedActor.scaleY - 1; -1669 }, -1670 -1671 __gestureChange : function( scale, rotation ) { -1672 if ( typeof scale==='undefined' || typeof rotation==='undefined' ) { -1673 return; -1674 } -1675 -1676 if ( this.lastSelectedActor!==null && this.lastSelectedActor.isGestureEnabled() ) { -1677 this.lastSelectedActor.setRotation( rotation*Math.PI/180 + this.__gestureRotation ); -1678 -1679 this.lastSelectedActor.setScale( -1680 this.__gestureSX + scale, -1681 this.__gestureSY + scale ); -1682 } -1683 -1684 }, -1685 -1686 __gestureEnd : function( scale, rotation ) { -1687 this.gesturing= false; -1688 this.__gestureRotation= 0; -1689 this.__gestureScale= 0; -1690 }, -1691 -1692 addHandlers: function(canvas) { +1664 var ev= new CAAT.MouseEvent().init( +1665 pos.x, +1666 pos.y, +1667 e, +1668 this.lastSelectedActor, +1669 this.screenMousePoint, +1670 this.currentScene.time); +1671 +1672 this.lastSelectedActor.mouseExit(ev); +1673 this.lastSelectedActor.mouseOut(ev); +1674 +1675 if ( !this.dragging ) { +1676 this.lastSelectedActor = null; +1677 } +1678 } else { +1679 this.isMouseDown = false; +1680 this.in_ = false; +1681 } +1682 +1683 }, +1684 +1685 __mouseOverHandler : function(e) { +1686 +1687 var lactor; +1688 var pos, ev; +1689 this.getCanvasCoord(this.mousePoint, e); +1690 +1691 if ( null==this.lastSelectedActor ) { +1692 lactor= this.findActorAtPosition( this.mousePoint ); 1693 -1694 var me= this; +1694 if (null !== lactor) { 1695 -1696 canvas.addEventListener('mouseup', function(e) { -1697 e.preventDefault(); -1698 me.__mouseUpHandler(e); -1699 }, false ); -1700 -1701 canvas.addEventListener('mousedown', function(e) { -1702 e.preventDefault(); -1703 me.__mouseDownHandler(e); -1704 }, false ); -1705 -1706 canvas.addEventListener('mouseover',function(e) { -1707 e.preventDefault(); -1708 me.__mouseOverHandler(e); -1709 }, false); +1696 pos = lactor.viewToModel( +1697 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1698 +1699 ev= new CAAT.MouseEvent().init( +1700 pos.x, +1701 pos.y, +1702 e, +1703 lactor, +1704 this.screenMousePoint, +1705 this.currentScene.time); +1706 +1707 lactor.mouseOver(ev); +1708 lactor.mouseEnter(ev); +1709 } 1710 -1711 canvas.addEventListener('mouseout',function(e) { -1712 e.preventDefault(); -1713 me.__mouseOutHandler(e); -1714 }, false); -1715 -1716 canvas.addEventListener('mousemove', -1717 function(e) { -1718 e.preventDefault(); -1719 me.__mouseMoveHandler(e); -1720 }, -1721 false); -1722 -1723 canvas.addEventListener("dblclick", function(e) { -1724 e.preventDefault(); -1725 me.__mouseDBLClickHandler(e); -1726 }, false); -1727 -1728 canvas.addEventListener("touchstart", this.__touchStartHandler.bind(this), false); -1729 canvas.addEventListener("touchmove", this.__touchMoveHandler.bind(this), false); -1730 canvas.addEventListener("touchend", this.__touchEndHandler.bind(this), false); -1731 canvas.addEventListener("gesturestart", function(e) { -1732 e.preventDefault(); -1733 me.__gestureStart( e.scale, e.rotation ); -1734 }, false ); -1735 canvas.addEventListener("gestureend", function(e) { -1736 e.preventDefault(); -1737 me.__gestureEnd( e.scale, e.rotation ); -1738 }, false ); -1739 canvas.addEventListener("gesturechange", function(e) { -1740 e.preventDefault(); -1741 me.__gestureChange( e.scale, e.rotation ); -1742 }, false ); -1743 }, -1744 -1745 enableEvents : function( onElement ) { -1746 CAAT.RegisterDirector(this); -1747 this.in_ = false; -1748 this.createEventHandler( onElement ); -1749 }, -1750 -1751 createEventHandler : function( onElement ) { -1752 //var canvas= this.canvas; -1753 this.in_ = false; -1754 //this.addHandlers(canvas); -1755 this.addHandlers( onElement ); -1756 } -1757 }; -1758 -1759 -1760 if (CAAT.__CSS__) { +1711 this.lastSelectedActor= lactor; +1712 } else { +1713 lactor= this.lastSelectedActor; +1714 pos = lactor.viewToModel( +1715 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1716 +1717 ev= new CAAT.MouseEvent().init( +1718 pos.x, +1719 pos.y, +1720 e, +1721 lactor, +1722 this.screenMousePoint, +1723 this.currentScene.time); +1724 +1725 lactor.mouseOver(ev); +1726 lactor.mouseEnter(ev); +1727 +1728 } +1729 }, +1730 +1731 __mouseDBLClickHandler : function(e) { +1732 +1733 this.getCanvasCoord(this.mousePoint, e); +1734 if (null !== this.lastSelectedActor) { +1735 /* +1736 var pos = this.lastSelectedActor.viewToModel( +1737 new CAAT.Point(this.screenMousePoint.x, this.screenMousePoint.y, 0)); +1738 */ +1739 this.lastSelectedActor.mouseDblClick( +1740 new CAAT.MouseEvent().init( +1741 this.mousePoint.x, +1742 this.mousePoint.y, +1743 e, +1744 this.lastSelectedActor, +1745 this.screenMousePoint, +1746 this.currentScene.time)); +1747 } +1748 }, +1749 +1750 /** +1751 * Same as mouseDown but not preventing event. +1752 * Will only take care of first touch. +1753 * @param e +1754 */ +1755 __touchStartHandler : function(e) { +1756 +1757 e.preventDefault(); +1758 e= e.targetTouches[0] +1759 this.__mouseDownHandler(e); +1760 }, 1761 -1762 CAAT.Director.prototype.clip= true; -1763 CAAT.Director.prototype.glEnabled= false; -1764 -1765 CAAT.Director.prototype.getRenderType= function() { -1766 return 'CSS'; -1767 }; +1762 __touchEndHandler : function(e) { +1763 +1764 e.preventDefault(); +1765 e= e.changedTouches[0]; +1766 this.__mouseUpHandler(e); +1767 }, 1768 -1769 CAAT.Director.prototype.setScaleProportional= function(w,h) { +1769 __touchMoveHandler : function(e) { 1770 -1771 var factor= Math.min(w/this.referenceWidth, h/this.referenceHeight); -1772 this.setScaleAnchored( factor, factor, 0, 0 ); -1773 -1774 this.eventHandler.style.width= ''+this.referenceWidth +'px'; -1775 this.eventHandler.style.height= ''+this.referenceHeight+'px'; -1776 }; -1777 -1778 CAAT.Director.prototype.setBounds= function(x, y, w, h) { -1779 CAAT.Director.superclass.setBounds.call(this, x, y, w, h); -1780 for (var i = 0; i < this.scenes.length; i++) { -1781 this.scenes[i].setBounds(0, 0, w, h); -1782 } -1783 this.eventHandler.style.width= w+'px'; -1784 this.eventHandler.style.height= h+'px'; -1785 -1786 return this; -1787 }; -1788 -1789 /** -1790 * In this DOM/CSS implementation, proxy is not taken into account since the event router is a top most -1791 * div in the document hierarchy (z-index 999999). -1792 * @param width -1793 * @param height -1794 * @param domElement -1795 * @param proxy -1796 */ -1797 CAAT.Director.prototype.initialize= function(width, height, domElement, proxy) { +1771 e.preventDefault(); +1772 +1773 if ( this.gesturing ) { +1774 return; +1775 } +1776 +1777 for( var i=0; i<e.targetTouches.length; i++ ) { +1778 if ( !i ) { +1779 this.__mouseMoveHandler(e.targetTouches[i]); +1780 } +1781 } +1782 }, +1783 +1784 __gestureStart : function( scale, rotation ) { +1785 this.gesturing= true; +1786 this.__gestureRotation= this.lastSelectedActor.rotationAngle; +1787 this.__gestureSX= this.lastSelectedActor.scaleX - 1; +1788 this.__gestureSY= this.lastSelectedActor.scaleY - 1; +1789 }, +1790 +1791 __gestureChange : function( scale, rotation ) { +1792 if ( typeof scale==='undefined' || typeof rotation==='undefined' ) { +1793 return; +1794 } +1795 +1796 if ( this.lastSelectedActor!==null && this.lastSelectedActor.isGestureEnabled() ) { +1797 this.lastSelectedActor.setRotation( rotation*Math.PI/180 + this.__gestureRotation ); 1798 -1799 this.timeline = new Date().getTime(); -1800 this.domElement= domElement; -1801 this.style('position','absolute'); -1802 this.style('width',''+width+'px'); -1803 this.style('height',''+height+'px'); -1804 this.style('overflow', 'hidden' ); +1799 this.lastSelectedActor.setScale( +1800 this.__gestureSX + scale, +1801 this.__gestureSY + scale ); +1802 } +1803 +1804 }, 1805 -1806 this.enableEvents(domElement); -1807 -1808 this.setBounds(0, 0, width, height); -1809 -1810 this.checkDebug(); -1811 return this; -1812 }; +1806 __gestureEnd : function( scale, rotation ) { +1807 this.gesturing= false; +1808 this.__gestureRotation= 0; +1809 this.__gestureScale= 0; +1810 }, +1811 +1812 addHandlers: function(canvas) { 1813 -1814 CAAT.Director.prototype.render= function(time) { +1814 var me= this; 1815 -1816 this.time += time; -1817 this.animate(this,time); -1818 -1819 /** -1820 * draw director active scenes. -1821 */ -1822 var i, l, tt; -1823 -1824 if ( CAAT.DEBUG ) { -1825 this.resetStats(); -1826 } -1827 -1828 for (i = 0, l=this.childrenList.length; i < l; i++) { -1829 var c= this.childrenList[i]; -1830 if (c.isInAnimationFrame(this.time)) { -1831 tt = c.time - c.start_time; -1832 if ( c.onRenderStart ) { -1833 c.onRenderStart(tt); -1834 } +1816 canvas.addEventListener('mouseup', function(e) { +1817 e.preventDefault(); +1818 me.__mouseUpHandler(e); +1819 }, false ); +1820 +1821 canvas.addEventListener('mousedown', function(e) { +1822 e.preventDefault(); +1823 me.__mouseDownHandler(e); +1824 }, false ); +1825 +1826 canvas.addEventListener('mouseover',function(e) { +1827 e.preventDefault(); +1828 me.__mouseOverHandler(e); +1829 }, false); +1830 +1831 canvas.addEventListener('mouseout',function(e) { +1832 e.preventDefault(); +1833 me.__mouseOutHandler(e); +1834 }, false); 1835 -1836 if ( c.onRenderEnd ) { -1837 c.onRenderEnd(tt); -1838 } -1839 -1840 if (!c.isPaused()) { -1841 c.time += time; -1842 } -1843 -1844 if ( CAAT.DEBUG ) { -1845 this.statistics.size_total+= c.size_total; -1846 this.statistics.size_active+= c.size_active; -1847 } -1848 -1849 } -1850 } -1851 -1852 this.frameCounter++; -1853 }; -1854 -1855 CAAT.Director.prototype.addScene= function(scene) { -1856 scene.setVisible(true); -1857 scene.setBounds(0, 0, this.width, this.height); -1858 this.scenes.push(scene); -1859 scene.setEaseListener(this); -1860 if (null === this.currentScene) { -1861 this.setScene(0); -1862 } -1863 -1864 this.domElement.appendChild( scene.domElement ); -1865 }; -1866 -1867 CAAT.Director.prototype.emptyScenes= function() { -1868 this.scenes = []; -1869 this.domElement.innerHTML=''; -1870 this.createEventHandler(); -1871 }; -1872 -1873 CAAT.Director.prototype.setClear= function(clear) { -1874 return this; -1875 }; -1876 -1877 CAAT.Director.prototype.createEventHandler= function() { -1878 this.eventHandler= document.createElement('div'); -1879 this.domElement.appendChild(this.eventHandler); -1880 -1881 this.eventHandler.style.position= 'absolute'; -1882 this.eventHandler.style.left= '0'; -1883 this.eventHandler.style.top= '0'; -1884 this.eventHandler.style.zIndex= 999999; -1885 this.eventHandler.style.width= ''+this.width+'px'; -1886 this.eventHandler.style.height= ''+this.height+'px'; -1887 -1888 var canvas= this.eventHandler; -1889 this.in_ = false; +1836 canvas.addEventListener('mousemove', +1837 function(e) { +1838 e.preventDefault(); +1839 me.__mouseMoveHandler(e); +1840 }, +1841 false); +1842 +1843 canvas.addEventListener("dblclick", function(e) { +1844 e.preventDefault(); +1845 me.__mouseDBLClickHandler(e); +1846 }, false); +1847 +1848 canvas.addEventListener("touchstart", this.__touchStartHandler.bind(this), false); +1849 canvas.addEventListener("touchmove", this.__touchMoveHandler.bind(this), false); +1850 canvas.addEventListener("touchend", this.__touchEndHandler.bind(this), false); +1851 canvas.addEventListener("gesturestart", function(e) { +1852 e.preventDefault(); +1853 me.__gestureStart( e.scale, e.rotation ); +1854 }, false ); +1855 canvas.addEventListener("gestureend", function(e) { +1856 e.preventDefault(); +1857 me.__gestureEnd( e.scale, e.rotation ); +1858 }, false ); +1859 canvas.addEventListener("gesturechange", function(e) { +1860 e.preventDefault(); +1861 me.__gestureChange( e.scale, e.rotation ); +1862 }, false ); +1863 }, +1864 +1865 enableEvents : function( onElement ) { +1866 CAAT.RegisterDirector(this); +1867 this.in_ = false; +1868 this.createEventHandler( onElement ); +1869 }, +1870 +1871 createEventHandler : function( onElement ) { +1872 //var canvas= this.canvas; +1873 this.in_ = false; +1874 //this.addHandlers(canvas); +1875 this.addHandlers( onElement ); +1876 } +1877 }; +1878 +1879 +1880 if (CAAT.__CSS__) { +1881 +1882 CAAT.Director.prototype.clip= true; +1883 CAAT.Director.prototype.glEnabled= false; +1884 +1885 CAAT.Director.prototype.getRenderType= function() { +1886 return 'CSS'; +1887 }; +1888 +1889 CAAT.Director.prototype.setScaleProportional= function(w,h) { 1890 -1891 this.addHandlers(canvas); -1892 }; -1893 } -1894 -1895 extend(CAAT.Director, CAAT.ActorContainer, null); -1896 })(); \ No newline at end of file +1891 var factor= Math.min(w/this.referenceWidth, h/this.referenceHeight); +1892 this.setScaleAnchored( factor, factor, 0, 0 ); +1893 +1894 this.eventHandler.style.width= ''+this.referenceWidth +'px'; +1895 this.eventHandler.style.height= ''+this.referenceHeight+'px'; +1896 }; +1897 +1898 CAAT.Director.prototype.setBounds= function(x, y, w, h) { +1899 CAAT.Director.superclass.setBounds.call(this, x, y, w, h); +1900 for (var i = 0; i < this.scenes.length; i++) { +1901 this.scenes[i].setBounds(0, 0, w, h); +1902 } +1903 this.eventHandler.style.width= w+'px'; +1904 this.eventHandler.style.height= h+'px'; +1905 +1906 return this; +1907 }; +1908 +1909 /** +1910 * In this DOM/CSS implementation, proxy is not taken into account since the event router is a top most +1911 * div in the document hierarchy (z-index 999999). +1912 * @param width +1913 * @param height +1914 * @param domElement +1915 * @param proxy +1916 */ +1917 CAAT.Director.prototype.initialize= function(width, height, domElement, proxy) { +1918 +1919 this.timeline = new Date().getTime(); +1920 this.domElement= domElement; +1921 this.style('position','absolute'); +1922 this.style('width',''+width+'px'); +1923 this.style('height',''+height+'px'); +1924 this.style('overflow', 'hidden' ); +1925 +1926 this.enableEvents(domElement); +1927 +1928 this.setBounds(0, 0, width, height); +1929 +1930 this.checkDebug(); +1931 return this; +1932 }; +1933 +1934 CAAT.Director.prototype.render= function(time) { +1935 +1936 this.time += time; +1937 this.animate(this,time); +1938 +1939 /** +1940 * draw director active scenes. +1941 */ +1942 var i, l, tt; +1943 +1944 if ( CAAT.DEBUG ) { +1945 this.resetStats(); +1946 } +1947 +1948 for (i = 0, l=this.childrenList.length; i < l; i++) { +1949 var c= this.childrenList[i]; +1950 if (c.isInAnimationFrame(this.time)) { +1951 tt = c.time - c.start_time; +1952 if ( c.onRenderStart ) { +1953 c.onRenderStart(tt); +1954 } +1955 +1956 if ( c.onRenderEnd ) { +1957 c.onRenderEnd(tt); +1958 } +1959 +1960 if (!c.isPaused()) { +1961 c.time += time; +1962 } +1963 +1964 if ( CAAT.DEBUG ) { +1965 this.statistics.size_total+= c.size_total; +1966 this.statistics.size_active+= c.size_active; +1967 } +1968 +1969 } +1970 } +1971 +1972 this.frameCounter++; +1973 }; +1974 +1975 CAAT.Director.prototype.addScene= function(scene) { +1976 scene.setVisible(true); +1977 scene.setBounds(0, 0, this.width, this.height); +1978 this.scenes.push(scene); +1979 scene.setEaseListener(this); +1980 if (null === this.currentScene) { +1981 this.setScene(0); +1982 } +1983 +1984 this.domElement.appendChild( scene.domElement ); +1985 }; +1986 +1987 CAAT.Director.prototype.emptyScenes= function() { +1988 this.scenes = []; +1989 this.domElement.innerHTML=''; +1990 this.createEventHandler(); +1991 }; +1992 +1993 CAAT.Director.prototype.setClear= function(clear) { +1994 return this; +1995 }; +1996 +1997 CAAT.Director.prototype.createEventHandler= function() { +1998 this.eventHandler= document.createElement('div'); +1999 this.domElement.appendChild(this.eventHandler); +2000 +2001 this.eventHandler.style.position= 'absolute'; +2002 this.eventHandler.style.left= '0'; +2003 this.eventHandler.style.top= '0'; +2004 this.eventHandler.style.zIndex= 999999; +2005 this.eventHandler.style.width= ''+this.width+'px'; +2006 this.eventHandler.style.height= ''+this.height+'px'; +2007 +2008 var canvas= this.eventHandler; +2009 this.in_ = false; +2010 +2011 this.addHandlers(canvas); +2012 }; +2013 } +2014 +2015 extend(CAAT.Director, CAAT.ActorContainer, null); +2016 })(); \ No newline at end of file diff --git a/src/model/director.js b/src/model/director.js index 0df7f440..0f6ac648 100644 --- a/src/model/director.js +++ b/src/model/director.js @@ -56,6 +56,7 @@ CAAT.Director.CLEAR_DIRTY_RECTS= 1; CAAT.Director.CLEAR_ALL= true; + CAAT.Director.CLEAR_NONE= false; CAAT.Director.prototype = { @@ -507,7 +508,12 @@ return this; }, - + /** + * + * Reset statistics information. + * + * @private + */ resetStats : function() { this.statistics.size_total= 0; this.statistics.size_active=0; @@ -520,6 +526,9 @@ * This virtual timeline will provide each Scene with its own virtual timeline, and will only * feed time when the Scene is the current Scene, or is being switched. * + * If dirty rectangles are enabled and canvas is used for rendering, the dirty rectangles will be + * set up as a single clip area. + * * @param time {number} integer indicating the elapsed time between two consecutive frames of the * Director. */ @@ -580,7 +589,6 @@ if ( this.dirtyRectsEnabled ) { ctx.beginPath(); -ctx.rect(0,0,100,40); var dr= this.cDirtyRects; for( i=0; i