1 /****************************************************************************
  2  Copyright (c) 2010-2012 cocos2d-x.org
  3  Copyright (c) 2008-2010 Ricardo Quesada
  4  Copyright (c) 2011      Zynga Inc.
  5 
  6  http://www.cocos2d-x.org
  7 
  8  Permission is hereby granted, free of charge, to any person obtaining a copy
  9  of this software and associated documentation files (the "Software"), to deal
 10  in the Software without restriction, including without limitation the rights
 11  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 12  copies of the Software, and to permit persons to whom the Software is
 13  furnished to do so, subject to the following conditions:
 14 
 15  The above copyright notice and this permission notice shall be included in
 16  all copies or substantial portions of the Software.
 17 
 18  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 19  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 20  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 21  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 22  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 23  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 24  THE SOFTWARE.
 25  ****************************************************************************/
 26 /**
 27  * A tag constant for identifying fade scenes
 28  * @constant
 29  * @type Number
 30  */
 31 cc.SCENE_FADE = 4208917214;
 32 
 33 /**
 34  * cc.TransitionEaseScene can ease the actions of the scene protocol.
 35  * @class
 36  * @extends cc.Class
 37  */
 38 cc.TransitionEaseScene = cc.Class.extend(/** @lends cc.TransitionEaseScene# */{
 39     /**
 40      * returns the Ease action that will be performed on a linear action.
 41      */
 42     easeActionWithAction:function () {
 43     }
 44 });
 45 
 46 /**
 47  * horizontal orientation Type where the Left is nearer
 48  * @constant
 49  * @type Number
 50  */
 51 cc.TRANSITION_ORIENTATION_LEFT_OVER = 0;
 52 /**
 53  * horizontal orientation type where the Right is nearer
 54  * @constant
 55  * @type Number
 56  */
 57 cc.TRANSITION_ORIENTATION_RIGHT_OVER = 1;
 58 /**
 59  * vertical orientation type where the Up is nearer
 60  * @constant
 61  * @type Number
 62  */
 63 cc.TRANSITION_ORIENTATION_UP_OVER = 0;
 64 /**
 65  * vertical orientation type where the Bottom is nearer
 66  * @constant
 67  * @type Number
 68  */
 69 cc.TRANSITION_ORIENTATION_DOWN_OVER = 1;
 70 
 71 /**
 72  * @class
 73  * @extends cc.Scene
 74  */
 75 cc.TransitionScene = cc.Scene.extend(/** @lends cc.TransitionScene# */{
 76     _inScene:null,
 77     _outScene:null,
 78     _duration:null,
 79     _isInSceneOnTop:false,
 80     _isSendCleanupToScene:false,
 81     _className:"TransitionScene",
 82 
 83     //private
 84     _setNewScene:function (dt) {
 85         this.unschedule(this._setNewScene);
 86         // Before replacing, save the "send cleanup to scene"
 87         var director = cc.director;
 88         this._isSendCleanupToScene = director.isSendCleanupToScene();
 89         director.runScene(this._inScene);
 90 
 91         // enable events while transitions
 92         cc.eventManager.setEnabled(true);
 93 
 94         // issue #267
 95         this._outScene.visible = true;
 96     },
 97 
 98     //protected
 99     _sceneOrder:function () {
100         this._isInSceneOnTop = true;
101     },
102 
103     /**
104      * stuff gets drawn here
105      */
106     draw:function () {
107         if (this._isInSceneOnTop) {
108             this._outScene.visit();
109             this._inScene.visit();
110         } else {
111             this._inScene.visit();
112             this._outScene.visit();
113         }
114     },
115 
116     /**
117      * custom onEnter
118      */
119     onEnter:function () {
120         cc.Node.prototype.onEnter.call(this);
121 
122         // disable events while transitions
123         cc.eventManager.setEnabled(false);
124 
125         // outScene should not receive the onEnter callback
126         // only the onExitTransitionDidStart
127         this._outScene.onExitTransitionDidStart();
128 
129         this._inScene.onEnter();
130     },
131 
132     /**
133      * custom onExit
134      */
135     onExit:function () {
136         cc.Node.prototype.onExit.call(this);
137 
138         // enable events while transitions
139         cc.eventManager.setEnabled(true);
140 
141         this._outScene.onExit();
142 
143         // _inScene should not receive the onEnter callback
144         // only the onEnterTransitionDidFinish
145         this._inScene.onEnterTransitionDidFinish();
146     },
147 
148     /**
149      * custom cleanup
150      */
151     cleanup:function () {
152         cc.Node.prototype.cleanup.call(this);
153 
154         if (this._isSendCleanupToScene)
155             this._outScene.cleanup();
156     },
157 
158     /**
159      * initializes a transition with duration and incoming scene
160      * @param {Number} t time in seconds
161      * @param {cc.Scene} scene a scene to transit to
162      * @return {Boolean} return false if error
163      */
164     initWithDuration:function (t, scene) {
165         if(!scene)
166             throw "cc.TransitionScene.initWithDuration(): Argument scene must be non-nil";
167 
168         if (this.init()) {
169             this._duration = t;
170             this.attr({
171 	            x: 0,
172 	            y: 0,
173 	            anchorX: 0,
174 	            anchorY: 0
175             });
176             // retain
177             this._inScene = scene;
178             this._outScene = cc.director.getRunningScene();
179             if (!this._outScene) {
180                 this._outScene = cc.Scene.create();
181                 this._outScene.init();
182             }
183 
184             if(this._inScene == this._outScene)
185                 throw "cc.TransitionScene.initWithDuration(): Incoming scene must be different from the outgoing scene";
186 
187             this._sceneOrder();
188             return true;
189         } else {
190             return false;
191         }
192     },
193 
194     /**
195      * called after the transition finishes
196      */
197     finish:function () {
198         // clean up
199         this._inScene.attr({
200 			visible: true,
201 	        x: 0,
202 	        y: 0,
203 	        scale: 1.0,
204 	        rotation: 0.0
205         });
206         if(cc._renderType === cc._RENDER_TYPE_WEBGL)
207             this._inScene.getCamera().restore();
208 
209         this._outScene.attr({
210 	        visible: false,
211 	        x: 0,
212 	        y: 0,
213 	        scale: 1.0,
214 	        rotation: 0.0
215         });
216         if(cc._renderType === cc._RENDER_TYPE_WEBGL)
217             this._outScene.getCamera().restore();
218 
219         //[self schedule:@selector(setNewScene:) interval:0];
220         this.schedule(this._setNewScene, 0);
221     },
222 
223     /**
224      * set hide the out scene and show in scene
225      */
226     hideOutShowIn:function () {
227         this._inScene.visible = true;
228         this._outScene.visible = false;
229     }
230 });
231 /**
232  * creates a base transition with duration and incoming scene
233  * @param {Number} t time in seconds
234  * @param {cc.Scene} scene the scene to transit with
235  * @return {cc.TransitionScene|Null}
236  */
237 cc.TransitionScene.create = function (t, scene) {
238     var tempScene = new cc.TransitionScene();
239     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
240         return tempScene;
241     }
242     return null;
243 };
244 
245 /**
246  * A cc.Transition that supports orientation like.<br/>
247  * Possible orientation: LeftOver, RightOver, UpOver, DownOver<br/>
248  * useful for when you want to make a transition happen between 2 orientations
249  * @class
250  * @extends cc.TransitionScene
251  */
252 cc.TransitionSceneOriented = cc.TransitionScene.extend(/** @lends cc.TransitionSceneOriented# */{
253     _orientation:0,
254 
255     /**
256      * initialize the transition
257      * @param {Number} t time in seconds
258      * @param {cc.Scene} scene
259      * @param {cc.TRANSITION_ORIENTATION_LEFT_OVER|cc.TRANSITION_ORIENTATION_RIGHT_OVER|cc.TRANSITION_ORIENTATION_UP_OVER|cc.TRANSITION_ORIENTATION_DOWN_OVER} orientation
260      * @return {Boolean}
261      */
262     initWithDuration:function (t, scene, orientation) {
263         if (cc.TransitionScene.prototype.initWithDuration.call(this, t, scene)) {
264             this._orientation = orientation;
265         }
266         return true;
267     }
268 });
269 
270 /**
271  * creates a base transition with duration and incoming scene
272  * @param {Number} t time in seconds
273  * @param {cc.Scene} scene
274  * @param {cc.TRANSITION_ORIENTATION_LEFT_OVER|cc.TRANSITION_ORIENTATION_RIGHT_OVER|cc.TRANSITION_ORIENTATION_UP_OVER|cc.TRANSITION_ORIENTATION_DOWN_OVER} orientation
275  * @return {cc.TransitionSceneOriented}
276  * @example
277  * // Example
278  * var goHorizontal = cc.TransitionSceneOriented.create(0.5, thisScene, cc.TRANSITION_ORIENTATION_LEFT_OVER)
279  */
280 cc.TransitionSceneOriented.create = function (t, scene, orientation) {
281     var tempScene = new cc.TransitionSceneOriented();
282     tempScene.initWithDuration(t, scene, orientation);
283 
284     return tempScene;
285 };
286 
287 /**
288  *  Rotate and zoom out the outgoing scene, and then rotate and zoom in the incoming
289  * @class
290  * @extends cc.TransitionScene
291  */
292 cc.TransitionRotoZoom = cc.TransitionScene.extend(/** @lends cc.TransitionRotoZoom# */{
293     /**
294      * Custom On Enter callback
295      * @override
296      */
297     onEnter:function () {
298         cc.TransitionScene.prototype.onEnter.call(this);
299 
300 	    this._inScene.attr({
301 		    scale: 0.001,
302 		    anchorX: 0.5,
303 		    anchorY: 0.5
304 	    });
305 	    this._outScene.attr({
306 		    scale: 1.0,
307 		    anchorX: 0.5,
308 		    anchorY: 0.5
309 	    });
310 	    
311         var rotoZoom = cc.Sequence.create(
312             cc.Spawn.create(cc.ScaleBy.create(this._duration / 2, 0.001),
313                 cc.RotateBy.create(this._duration / 2, 360 * 2)),
314             cc.DelayTime.create(this._duration / 2));
315 
316         this._outScene.runAction(rotoZoom);
317         this._inScene.runAction(
318             cc.Sequence.create(rotoZoom.reverse(),
319                 cc.CallFunc.create(this.finish, this)));
320     }
321 });
322 
323 /**
324  * Creates a Transtion rotation and zoom
325  * @param {Number} t time in seconds
326  * @param {cc.Scene} scene the scene to work with
327  * @return {cc.TransitionRotoZoom}
328  * @example
329  * // Example
330  * var RotoZoomTrans = cc.TransitionRotoZoom.create(2, nextScene);
331  */
332 cc.TransitionRotoZoom.create = function (t, scene) {
333     var tempScene = new cc.TransitionRotoZoom();
334     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
335         return tempScene;
336     }
337     return null;
338 };
339 
340 /**
341  * Zoom out and jump the outgoing scene, and then jump and zoom in the incoming
342  * @class
343  * @extends cc.TransitionScene
344  */
345 cc.TransitionJumpZoom = cc.TransitionScene.extend(/** @lends cc.TransitionJumpZoom# */{
346     /**
347      * Custom on enter
348      */
349     onEnter:function () {
350         cc.TransitionScene.prototype.onEnter.call(this);
351         var winSize = cc.director.getWinSize();
352 
353 	    this._inScene.attr({
354 		    scale: 0.5,
355 		    x: winSize.width,
356 		    y: 0,
357 		    anchorX: 0.5,
358 		    anchorY: 0.5
359 	    });
360         this._outScene.anchorX = 0.5;
361 	    this._outScene.anchorY = 0.5;
362 
363         var jump = cc.JumpBy.create(this._duration / 4, cc.p(-winSize.width, 0), winSize.width / 4, 2);
364         var scaleIn = cc.ScaleTo.create(this._duration / 4, 1.0);
365         var scaleOut = cc.ScaleTo.create(this._duration / 4, 0.5);
366 
367         var jumpZoomOut = cc.Sequence.create(scaleOut, jump);
368         var jumpZoomIn = cc.Sequence.create(jump, scaleIn);
369 
370         var delay = cc.DelayTime.create(this._duration / 2);
371         this._outScene.runAction(jumpZoomOut);
372         this._inScene.runAction(cc.Sequence.create(delay, jumpZoomIn, cc.CallFunc.create(this.finish, this)));
373     }
374 });
375 
376 /**
377  * creates a scene transition that zooms then jump across the screen, the same for the incoming scene
378  * @param {Number} t time in seconds
379  * @param {cc.Scene} scene
380  * @return {cc.TransitionJumpZoom}
381  */
382 cc.TransitionJumpZoom.create = function (t, scene) {
383     var tempScene = new cc.TransitionJumpZoom();
384     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
385         return tempScene;
386     }
387     return null;
388 };
389 
390 /**
391  * Move in from to the left the incoming scene.
392  * @class
393  * @extends cc.TransitionScene
394  */
395 cc.TransitionMoveInL = cc.TransitionScene.extend(/** @lends cc.TransitionMoveInL# */{
396 
397     /**
398      * Custom on enter
399      */
400     onEnter:function () {
401         cc.TransitionScene.prototype.onEnter.call(this);
402         this.initScenes();
403 
404         var action = this.action();
405         this._inScene.runAction(
406             cc.Sequence.create(this.easeActionWithAction(action), cc.CallFunc.create(this.finish, this))
407         );
408     },
409 
410     /**
411      * initializes the scenes
412      */
413     initScenes:function () {
414         this._inScene.setPosition(-cc.director.getWinSize().width, 0);
415     },
416 
417     /**
418      * returns the action that will be performed
419      */
420     action:function () {
421         return cc.MoveTo.create(this._duration, cc.p(0, 0));
422     },
423 
424     /**
425      * creates an ease action from action
426      * @param {cc.ActionInterval} action
427      * @return {cc.EaseOut}
428      */
429     easeActionWithAction:function (action) {
430         return cc.EaseOut.create(action, 2.0);
431     }
432 });
433 
434 /**
435  * creates an action that  Move in from to the left the incoming scene.
436  * @param {Number} t time in seconds
437  * @param {cc.Scene} scene
438  * @return {cc.TransitionMoveInL}
439  * @example
440  * // Example
441  * var MoveInLeft = cc.TransitionMoveInL.create(1, nextScene)
442  */
443 cc.TransitionMoveInL.create = function (t, scene) {
444     var tempScene = new cc.TransitionMoveInL();
445     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
446         return tempScene;
447     }
448     return null;
449 };
450 
451 /**
452  * Move in from to the right the incoming scene.
453  * @class
454  * @extends cc.TransitionMoveInL
455  */
456 cc.TransitionMoveInR = cc.TransitionMoveInL.extend(/** @lends cc.TransitionMoveInR# */{
457     /**
458      * Init
459      */
460     initScenes:function () {
461         this._inScene.setPosition(cc.director.getWinSize().width, 0);
462     }
463 });
464 
465 /**
466  * create a scene transition that Move in from to the right the incoming scene.
467  * @param {Number} t time in seconds
468  * @param {cc.Scene} scene
469  * @return {cc.TransitionMoveInR}
470  * @example
471  * // Example
472  * var MoveInRight = cc.TransitionMoveInR.create(1, nextScene)
473  */
474 cc.TransitionMoveInR.create = function (t, scene) {
475     var tempScene = new cc.TransitionMoveInR();
476     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
477         return tempScene;
478     }
479     return null;
480 };
481 
482 /**
483  * Move in from to the top the incoming scene.
484  * @class
485  * @extends cc.TransitionMoveInL
486  */
487 cc.TransitionMoveInT = cc.TransitionMoveInL.extend(/** @lends cc.TransitionMoveInT# */{
488 
489     /**
490      * init
491      */
492     initScenes:function () {
493         this._inScene.setPosition(0, cc.director.getWinSize().height);
494     }
495 });
496 
497 /**
498  * Move in from to the top the incoming scene.
499  * @param {Number} t time in seconds
500  * @param {cc.Scene} scene
501  * @return {cc.TransitionMoveInT}
502  * @example
503  * // Example
504  * var MoveInTop = cc.TransitionMoveInT.create(1, nextScene)
505  */
506 cc.TransitionMoveInT.create = function (t, scene) {
507     var tempScene = new cc.TransitionMoveInT();
508     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
509         return tempScene;
510     }
511     return null;
512 };
513 
514 /**
515  *  Move in from to the bottom the incoming scene.
516  * @class
517  * @extends cc.TransitionMoveInL
518  */
519 cc.TransitionMoveInB = cc.TransitionMoveInL.extend(/** @lends cc.TransitionMoveInB# */{
520 
521     /**
522      * init
523      */
524     initScenes:function () {
525         this._inScene.setPosition(0, -cc.director.getWinSize().height);
526     }
527 });
528 
529 /**
530  * create a scene transition that Move in from to the bottom the incoming scene.
531  * @param {Number} t time in seconds
532  * @param {cc.Scene} scene
533  * @return {cc.TransitionMoveInB}
534  * @example
535  * // Example
536  * var MoveinB = cc.TransitionMoveInB.create(1, nextScene)
537  */
538 cc.TransitionMoveInB.create = function (t, scene) {
539     var tempScene = new cc.TransitionMoveInB();
540     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
541         return tempScene;
542     }
543     return null;
544 };
545 
546 /**
547  * The adjust factor is needed to prevent issue #442<br/>
548  * One solution is to use DONT_RENDER_IN_SUBPIXELS images, but NO<br/>
549  * The other issue is that in some transitions (and I don't know why)<br/>
550  * the order should be reversed (In in top of Out or vice-versa).
551  * @constant
552  * @type Number
553  */
554 cc.ADJUST_FACTOR = 0.5;
555 
556 /**
557  * a transition that a new scene is slided from left
558  * @class
559  * @extends cc.TransitionScene
560  */
561 cc.TransitionSlideInL = cc.TransitionScene.extend(/** @lends cc.TransitionSlideInL# */{
562     _sceneOrder:function () {
563         this._isInSceneOnTop = false;
564     },
565 
566     /**
567      * custom on enter
568      */
569     onEnter:function () {
570         cc.TransitionScene.prototype.onEnter.call(this);
571         this.initScenes();
572 
573         var inA = this.action();
574         var outA = this.action();
575 
576         var inAction = this.easeActionWithAction(inA);
577         var outAction = cc.Sequence.create(this.easeActionWithAction(outA), cc.CallFunc.create(this.finish, this));
578         this._inScene.runAction(inAction);
579         this._outScene.runAction(outAction);
580     },
581 
582     /**
583      * initializes the scenes
584      */
585     initScenes:function () {
586         this._inScene.setPosition(-cc.director.getWinSize().width + cc.ADJUST_FACTOR, 0);
587     },
588     /**
589      * returns the action that will be performed by the incomming and outgoing scene
590      * @return {cc.MoveBy}
591      */
592     action:function () {
593         return cc.MoveBy.create(this._duration, cc.p(cc.director.getWinSize().width - cc.ADJUST_FACTOR, 0));
594     },
595 
596     /**
597      * @param {cc.ActionInterval} action
598      * @return {*}
599      */
600     easeActionWithAction:function (action) {
601         return cc.EaseOut.create(action, 2.0);
602     }
603 });
604 
605 /**
606  * create a transition that a new scene is slided from left
607  * @param {Number} t time in seconds
608  * @param {cc.Scene} scene
609  * @return {cc.TransitionSlideInL}
610  * @example
611  * // Example
612  * var myTransition = cc.TransitionSlideInL.create(1.5, nextScene)
613  */
614 cc.TransitionSlideInL.create = function (t, scene) {
615     var tempScene = new cc.TransitionSlideInL();
616     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
617         return tempScene;
618     }
619     return null;
620 };
621 
622 /**
623  *  Slide in the incoming scene from the right border.
624  * @class
625  * @extends cc.TransitionSlideInL
626  */
627 cc.TransitionSlideInR = cc.TransitionSlideInL.extend(/** @lends cc.TransitionSlideInR# */{
628     _sceneOrder:function () {
629         this._isInSceneOnTop = true;
630     },
631     /**
632      * initializes the scenes
633      */
634     initScenes:function () {
635         this._inScene.setPosition(cc.director.getWinSize().width - cc.ADJUST_FACTOR, 0);
636     },
637     /**
638      *  returns the action that will be performed by the incomming and outgoing scene
639      * @return {cc.MoveBy}
640      */
641     action:function () {
642         return cc.MoveBy.create(this._duration, cc.p(-(cc.director.getWinSize().width - cc.ADJUST_FACTOR), 0));
643     }
644 });
645 
646 /**
647  * create Slide in the incoming scene from the right border.
648  * @param {Number} t time in seconds
649  * @param {cc.Scene} scene
650  * @return {cc.TransitionSlideInR}
651  * @example
652  * // Example
653  * var myTransition = cc.TransitionSlideInR.create(1.5, nextScene)
654  */
655 cc.TransitionSlideInR.create = function (t, scene) {
656     var tempScene = new cc.TransitionSlideInR();
657     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
658         return tempScene;
659     }
660     return null;
661 };
662 
663 /**
664  * Slide in the incoming scene from the bottom border.
665  * @class
666  * @extends cc.TransitionSlideInL
667  */
668 cc.TransitionSlideInB = cc.TransitionSlideInL.extend(/** @lends cc.TransitionSlideInB# */{
669     _sceneOrder:function () {
670         this._isInSceneOnTop = false;
671     },
672 
673     /**
674      * initializes the scenes
675      */
676     initScenes:function () {
677         this._inScene.setPosition(0, cc.director.getWinSize().height - cc.ADJUST_FACTOR);
678     },
679 
680     /**
681      * returns the action that will be performed by the incomming and outgoing scene
682      * @return {cc.MoveBy}
683      */
684     action:function () {
685         return cc.MoveBy.create(this._duration, cc.p(0, -(cc.director.getWinSize().height - cc.ADJUST_FACTOR)));
686     }
687 });
688 
689 /**
690  * create a Slide in the incoming scene from the bottom border.
691  * @param {Number} t time in seconds
692  * @param {cc.Scene} scene
693  * @return {cc.TransitionSlideInB}
694  * @example
695  * // Example
696  * var myTransition = cc.TransitionSlideInB.create(1.5, nextScene)
697  */
698 cc.TransitionSlideInB.create = function (t, scene) {
699     var tempScene = new cc.TransitionSlideInB();
700     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
701         return tempScene;
702     }
703     return null;
704 };
705 
706 /**
707  *  Slide in the incoming scene from the top border.
708  *  @class
709  *  @extends cc.TransitionSlideInL
710  */
711 cc.TransitionSlideInT = cc.TransitionSlideInL.extend(/** @lends cc.TransitionSlideInT# */{
712     _sceneOrder:function () {
713         this._isInSceneOnTop = true;
714     },
715 
716     /**
717      * initializes the scenes
718      */
719     initScenes:function () {
720         this._inScene.setPosition(0, -(cc.director.getWinSize().height - cc.ADJUST_FACTOR));
721     },
722 
723     /**
724      * returns the action that will be performed by the incomming and outgoing scene
725      * @return {cc.MoveBy}
726      */
727     action:function () {
728         return cc.MoveBy.create(this._duration, cc.p(0, cc.director.getWinSize().height - cc.ADJUST_FACTOR));
729     }
730 });
731 
732 /**
733  * create a Slide in the incoming scene from the top border.
734  * @param {Number} t time in seconds
735  * @param {cc.Scene} scene
736  * @return {cc.TransitionSlideInT}
737  * @example
738  * // Example
739  * var myTransition = cc.TransitionSlideInT.create(1.5, nextScene)
740  */
741 cc.TransitionSlideInT.create = function (t, scene) {
742     var tempScene = new cc.TransitionSlideInT();
743     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
744         return tempScene;
745     }
746     return null;
747 };
748 
749 /**
750  * Shrink the outgoing scene while grow the incoming scene
751  * @class
752  * @extends cc.TransitionScene
753  */
754 cc.TransitionShrinkGrow = cc.TransitionScene.extend(/** @lends cc.TransitionShrinkGrow# */{
755 
756     /**
757      * Custom on enter
758      */
759     onEnter:function () {
760         cc.TransitionScene.prototype.onEnter.call(this);
761 
762 	    this._inScene.attr({
763 		    scale: 0.001,
764 		    anchorX: 2 / 3.0,
765 		    anchorY: 0.5
766 	    });
767 	    this._outScene.attr({
768 		    scale: 1.0,
769 		    anchorX: 1 / 3.0,
770 		    anchorY: 0.5
771 	    });
772 
773         var scaleOut = cc.ScaleTo.create(this._duration, 0.01);
774         var scaleIn = cc.ScaleTo.create(this._duration, 1.0);
775 
776         this._inScene.runAction(this.easeActionWithAction(scaleIn));
777         this._outScene.runAction(
778             cc.Sequence.create(this.easeActionWithAction(scaleOut), cc.CallFunc.create(this.finish, this))
779         );
780     },
781 
782     /**
783      * @param action
784      * @return {cc.EaseOut}
785      */
786     easeActionWithAction:function (action) {
787         return cc.EaseOut.create(action, 2.0);
788     }
789 });
790 
791 /**
792  * Shrink the outgoing scene while grow the incoming scene
793  * @param {Number} t time in seconds
794  * @param {cc.Scene} scene
795  * @return {cc.TransitionShrinkGrow}
796  * @example
797  * // Example
798  * var myTransition = cc.TransitionShrinkGrow.create(1.5, nextScene)
799  */
800 cc.TransitionShrinkGrow.create = function (t, scene) {
801     var tempScene = new cc.TransitionShrinkGrow();
802     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
803         return tempScene;
804     }
805     return null;
806 };
807 
808 /**
809  *  Flips the screen horizontally.<br/>
810  * The front face is the outgoing scene and the back face is the incoming scene.
811  * @class
812  * @extends cc.TransitionSceneOriented
813  */
814 cc.TransitionFlipX = cc.TransitionSceneOriented.extend(/** @lends cc.TransitionFlipX# */{
815 
816     /**
817      * custom on enter
818      */
819     onEnter:function () {
820         cc.TransitionScene.prototype.onEnter.call(this);
821 
822         var inA, outA;
823         this._inScene.visible = false;
824 
825         var inDeltaZ, inAngleZ, outDeltaZ, outAngleZ;
826 
827         if (this._orientation === cc.TRANSITION_ORIENTATION_RIGHT_OVER) {
828             inDeltaZ = 90;
829             inAngleZ = 270;
830             outDeltaZ = 90;
831             outAngleZ = 0;
832         } else {
833             inDeltaZ = -90;
834             inAngleZ = 90;
835             outDeltaZ = -90;
836             outAngleZ = 0;
837         }
838 
839         inA = cc.Sequence.create(
840             cc.DelayTime.create(this._duration / 2), cc.Show.create(),
841             cc.OrbitCamera.create(this._duration / 2, 1, 0, inAngleZ, inDeltaZ, 0, 0),
842             cc.CallFunc.create(this.finish, this)
843         );
844 
845         outA = cc.Sequence.create(
846             cc.OrbitCamera.create(this._duration / 2, 1, 0, outAngleZ, outDeltaZ, 0, 0),
847             cc.Hide.create(), cc.DelayTime.create(this._duration / 2)
848         );
849 
850         this._inScene.runAction(inA);
851         this._outScene.runAction(outA);
852     }
853 });
854 
855 /**
856  * Flips the screen horizontally.<br/>
857  * The front face is the outgoing scene and the back face is the incoming scene.
858  * @param {Number} t time in seconds
859  * @param {cc.Scene} scene
860  * @param {cc.TRANSITION_ORIENTATION_LEFT_OVER|cc.TRANSITION_ORIENTATION_RIGHT_OVER|cc.TRANSITION_ORIENTATION_UP_OVER|cc.TRANSITION_ORIENTATION_DOWN_OVER} o
861  * @return {cc.TransitionFlipX}
862  * @example
863  * // Example
864  * var myTransition = cc.TransitionFlipX.create(1.5, nextScene) //default is cc.TRANSITION_ORIENTATION_RIGHT_OVER
865  *
866  * //OR
867  * var myTransition = cc.TransitionFlipX.create(1.5, nextScene, cc.TRANSITION_ORIENTATION_UP_OVER)
868  */
869 cc.TransitionFlipX.create = function (t, scene, o) {
870     if (o == null)
871         o = cc.TRANSITION_ORIENTATION_RIGHT_OVER;
872 
873     var tempScene = new cc.TransitionFlipX();
874     tempScene.initWithDuration(t, scene, o);
875     return tempScene;
876 };
877 
878 /**
879  * Flips the screen vertically.<br/>
880  * The front face is the outgoing scene and the back face is the incoming scene.
881  * @class
882  * @extends cc.TransitionSceneOriented
883  */
884 cc.TransitionFlipY = cc.TransitionSceneOriented.extend(/** @lends cc.TransitionFlipY# */{
885 
886     /**
887      * custom on enter
888      */
889     onEnter:function () {
890         cc.TransitionScene.prototype.onEnter.call(this);
891 
892         var inA, outA;
893         this._inScene.visible = false;
894 
895         var inDeltaZ, inAngleZ, outDeltaZ, outAngleZ;
896 
897         if (this._orientation == cc.TRANSITION_ORIENTATION_UP_OVER) {
898             inDeltaZ = 90;
899             inAngleZ = 270;
900             outDeltaZ = 90;
901             outAngleZ = 0;
902         } else {
903             inDeltaZ = -90;
904             inAngleZ = 90;
905             outDeltaZ = -90;
906             outAngleZ = 0;
907         }
908 
909         inA = cc.Sequence.create(
910             cc.DelayTime.create(this._duration / 2), cc.Show.create(),
911             cc.OrbitCamera.create(this._duration / 2, 1, 0, inAngleZ, inDeltaZ, 90, 0),
912             cc.CallFunc.create(this.finish, this)
913         );
914         outA = cc.Sequence.create(
915             cc.OrbitCamera.create(this._duration / 2, 1, 0, outAngleZ, outDeltaZ, 90, 0),
916             cc.Hide.create(), cc.DelayTime.create(this._duration / 2)
917         );
918 
919         this._inScene.runAction(inA);
920         this._outScene.runAction(outA);
921     }
922 });
923 
924 /**
925  * Flips the screen vertically.<br/>
926  * The front face is the outgoing scene and the back face is the incoming scene.
927  * @param {Number} t time in seconds
928  * @param {cc.Scene} scene
929  * @param {cc.TRANSITION_ORIENTATION_LEFT_OVER|cc.TRANSITION_ORIENTATION_RIGHT_OVER|cc.TRANSITION_ORIENTATION_UP_OVER|cc.TRANSITION_ORIENTATION_DOWN_OVER} o
930  * @return {cc.TransitionFlipY}
931  * @example
932  * // Example
933  * var myTransition = cc.TransitionFlipY.create(1.5, nextScene)//default is cc.TRANSITION_ORIENTATION_UP_OVER
934  *
935  * //OR
936  * var myTransition = cc.TransitionFlipY.create(1.5, nextScene, cc.TRANSITION_ORIENTATION_RIGHT_OVER)
937  */
938 cc.TransitionFlipY.create = function (t, scene, o) {
939     if (o == null)
940         o = cc.TRANSITION_ORIENTATION_UP_OVER;
941 
942     var tempScene = new cc.TransitionFlipY();
943     tempScene.initWithDuration(t, scene, o);
944 
945     return tempScene;
946 };
947 
948 /**
949  * Flips the screen half horizontally and half vertically.<br/>
950  * The front face is the outgoing scene and the back face is the incoming scene.
951  * @class
952  * @extends cc.TransitionSceneOriented
953  */
954 cc.TransitionFlipAngular = cc.TransitionSceneOriented.extend(/** @lends cc.TransitionFlipAngular# */{
955     /**
956      * custom on enter
957      */
958     onEnter:function () {
959         cc.TransitionScene.prototype.onEnter.call(this);
960 
961         var inA, outA;
962         this._inScene.visible = false;
963 
964         var inDeltaZ, inAngleZ, outDeltaZ, outAngleZ;
965 
966         if (this._orientation === cc.TRANSITION_ORIENTATION_RIGHT_OVER) {
967             inDeltaZ = 90;
968             inAngleZ = 270;
969             outDeltaZ = 90;
970             outAngleZ = 0;
971         } else {
972             inDeltaZ = -90;
973             inAngleZ = 90;
974             outDeltaZ = -90;
975             outAngleZ = 0;
976         }
977 
978         inA = cc.Sequence.create(
979             cc.DelayTime.create(this._duration / 2), cc.Show.create(),
980             cc.OrbitCamera.create(this._duration / 2, 1, 0, inAngleZ, inDeltaZ, -45, 0),
981             cc.CallFunc.create(this.finish, this)
982         );
983         outA = cc.Sequence.create(
984             cc.OrbitCamera.create(this._duration / 2, 1, 0, outAngleZ, outDeltaZ, 45, 0),
985             cc.Hide.create(), cc.DelayTime.create(this._duration / 2)
986         );
987 
988         this._inScene.runAction(inA);
989         this._outScene.runAction(outA);
990     }
991 });
992 
993 /**
994  * Flips the screen half horizontally and half vertically.<br/>
995  * The front face is the outgoing scene and the back face is the incoming scene.
996  * @param {Number} t time in seconds
997  * @param {cc.Scene} scene
998  * @param {cc.TRANSITION_ORIENTATION_LEFT_OVER|cc.TRANSITION_ORIENTATION_RIGHT_OVER|cc.TRANSITION_ORIENTATION_UP_OVER|cc.TRANSITION_ORIENTATION_DOWN_OVER} o
999  * @return {cc.TransitionFlipAngular}
1000  * @example
1001  * // Example
1002  * var myTransition = cc.TransitionFlipAngular.create(1.5, nextScene)//default is cc.TRANSITION_ORIENTATION_RIGHT_OVER
1003  *
1004  * //or
1005  * var myTransition = cc.TransitionFlipAngular.create(1.5, nextScene, cc.TRANSITION_ORIENTATION_DOWN_OVER)
1006  */
1007 cc.TransitionFlipAngular.create = function (t, scene, o) {
1008     if (o == null)
1009         o = cc.TRANSITION_ORIENTATION_RIGHT_OVER;
1010 
1011     var tempScene = new cc.TransitionFlipAngular();
1012     tempScene.initWithDuration(t, scene, o);
1013 
1014     return tempScene;
1015 };
1016 
1017 /**
1018  *  Flips the screen horizontally doing a zoom out/in<br/>
1019  * The front face is the outgoing scene and the back face is the incoming scene.
1020  * @class
1021  * @extends cc.TransitionSceneOriented
1022  */
1023 cc.TransitionZoomFlipX = cc.TransitionSceneOriented.extend(/** @lends cc.TransitionZoomFlipX# */{
1024 
1025     /**
1026      * custom on enter
1027      */
1028     onEnter:function () {
1029         cc.TransitionScene.prototype.onEnter.call(this);
1030 
1031         var inA, outA;
1032         this._inScene.visible = false;
1033 
1034         var inDeltaZ, inAngleZ, outDeltaZ, outAngleZ;
1035 
1036         if (this._orientation === cc.TRANSITION_ORIENTATION_RIGHT_OVER) {
1037             inDeltaZ = 90;
1038             inAngleZ = 270;
1039             outDeltaZ = 90;
1040             outAngleZ = 0;
1041         } else {
1042             inDeltaZ = -90;
1043             inAngleZ = 90;
1044             outDeltaZ = -90;
1045             outAngleZ = 0;
1046         }
1047 
1048         inA = cc.Sequence.create(
1049             cc.DelayTime.create(this._duration / 2),
1050             cc.Spawn.create(
1051                 cc.OrbitCamera.create(this._duration / 2, 1, 0, inAngleZ, inDeltaZ, 0, 0),
1052                 cc.ScaleTo.create(this._duration / 2, 1), cc.Show.create()),
1053             cc.CallFunc.create(this.finish, this)
1054         );
1055         outA = cc.Sequence.create(
1056             cc.Spawn.create(
1057                 cc.OrbitCamera.create(this._duration / 2, 1, 0, outAngleZ, outDeltaZ, 0, 0),
1058                 cc.ScaleTo.create(this._duration / 2, 0.5)),
1059             cc.Hide.create(),
1060             cc.DelayTime.create(this._duration / 2)
1061         );
1062 
1063         this._inScene.scale = 0.5;
1064         this._inScene.runAction(inA);
1065         this._outScene.runAction(outA);
1066     }
1067 });
1068 
1069 /**
1070  * Flips the screen horizontally doing a zoom out/in<br/>
1071  * The front face is the outgoing scene and the back face is the incoming scene.
1072  * @param {Number} t time in seconds
1073  * @param {cc.Scene} scene
1074  * @param {cc.TRANSITION_ORIENTATION_LEFT_OVER|cc.TRANSITION_ORIENTATION_RIGHT_OVER|cc.TRANSITION_ORIENTATION_UP_OVER|cc.TRANSITION_ORIENTATION_DOWN_OVER} o
1075  * @return {cc.TransitionZoomFlipX}
1076  * @example
1077  * // Example
1078  * var myTransition = cc.TransitionZoomFlipX.create(1.5, nextScene)//default is cc.TRANSITION_ORIENTATION_RIGHT_OVER
1079  *
1080  * //OR
1081  * var myTransition = cc.TransitionZoomFlipX.create(1.5, nextScene, cc.TRANSITION_ORIENTATION_DOWN_OVER)
1082  */
1083 cc.TransitionZoomFlipX.create = function (t, scene, o) {
1084     if (o == null)
1085         o = cc.TRANSITION_ORIENTATION_RIGHT_OVER;
1086 
1087     var tempScene = new cc.TransitionZoomFlipX();
1088     tempScene.initWithDuration(t, scene, o);
1089 
1090     return tempScene;
1091 };
1092 
1093 /**
1094  * Flips the screen vertically doing a little zooming out/in<br/>
1095  * The front face is the outgoing scene and the back face is the incoming scene.
1096  * @class
1097  * @extends cc.TransitionSceneOriented
1098  */
1099 cc.TransitionZoomFlipY = cc.TransitionSceneOriented.extend(/** @lends cc.TransitionZoomFlipY# */{
1100 
1101     /**
1102      * custom on enter
1103      */
1104     onEnter:function () {
1105         cc.TransitionScene.prototype.onEnter.call(this);
1106 
1107         var inA, outA;
1108         this._inScene.visible = false;
1109 
1110         var inDeltaZ, inAngleZ, outDeltaZ, outAngleZ;
1111 
1112         if (this._orientation === cc.TRANSITION_ORIENTATION_UP_OVER) {
1113             inDeltaZ = 90;
1114             inAngleZ = 270;
1115             outDeltaZ = 90;
1116             outAngleZ = 0;
1117         } else {
1118             inDeltaZ = -90;
1119             inAngleZ = 90;
1120             outDeltaZ = -90;
1121             outAngleZ = 0;
1122         }
1123 
1124         inA = cc.Sequence.create(
1125             cc.DelayTime.create(this._duration / 2),
1126             cc.Spawn.create(
1127                 cc.OrbitCamera.create(this._duration / 2, 1, 0, inAngleZ, inDeltaZ, 90, 0),
1128                 cc.ScaleTo.create(this._duration / 2, 1), cc.Show.create()),
1129             cc.CallFunc.create(this.finish, this));
1130 
1131         outA = cc.Sequence.create(
1132             cc.Spawn.create(
1133                 cc.OrbitCamera.create(this._duration / 2, 1, 0, outAngleZ, outDeltaZ, 90, 0),
1134                 cc.ScaleTo.create(this._duration / 2, 0.5)),
1135             cc.Hide.create(), cc.DelayTime.create(this._duration / 2));
1136 
1137         this._inScene.scale = 0.5;
1138         this._inScene.runAction(inA);
1139         this._outScene.runAction(outA);
1140     }
1141 });
1142 
1143 /**
1144  * Flips the screen vertically doing a little zooming out/in<br/>
1145  * The front face is the outgoing scene and the back face is the incoming scene.
1146  * @param {Number} t time in seconds
1147  * @param {cc.Scene} scene
1148  * @param {cc.TRANSITION_ORIENTATION_LEFT_OVER|cc.TRANSITION_ORIENTATION_RIGHT_OVER|cc.TRANSITION_ORIENTATION_UP_OVER|cc.TRANSITION_ORIENTATION_DOWN_OVER} o
1149  * @return {cc.TransitionZoomFlipY}
1150  * @example
1151  * // Example
1152  * var myTransition = cc.TransitionZoomFlipY.create(1.5, nextScene)//default is cc.TRANSITION_ORIENTATION_UP_OVER
1153  *
1154  * //OR
1155  * var myTransition = cc.TransitionZoomFlipY.create(1.5, nextScene, cc.TRANSITION_ORIENTATION_DOWN_OVER)
1156  */
1157 cc.TransitionZoomFlipY.create = function (t, scene, o) {
1158     if (o == null)
1159         o = cc.TRANSITION_ORIENTATION_UP_OVER;
1160 
1161     var tempScene = new cc.TransitionZoomFlipY();
1162     tempScene.initWithDuration(t, scene, o);
1163 
1164     return tempScene;
1165 };
1166 
1167 /**
1168  *  Flips the screen half horizontally and half vertically doing a little zooming out/in.<br/>
1169  * The front face is the outgoing scene and the back face is the incoming scene.
1170  * @class
1171  * @extends cc.TransitionSceneOriented
1172  */
1173 cc.TransitionZoomFlipAngular = cc.TransitionSceneOriented.extend(/** @lends cc.TransitionZoomFlipAngular# */{
1174 
1175     /**
1176      * custom on enter
1177      */
1178     onEnter:function () {
1179         cc.TransitionScene.prototype.onEnter.call(this);
1180 
1181         var inA, outA;
1182         this._inScene.visible = false;
1183 
1184         var inDeltaZ, inAngleZ, outDeltaZ, outAngleZ;
1185         if (this._orientation === cc.TRANSITION_ORIENTATION_RIGHT_OVER) {
1186             inDeltaZ = 90;
1187             inAngleZ = 270;
1188             outDeltaZ = 90;
1189             outAngleZ = 0;
1190         } else {
1191             inDeltaZ = -90;
1192             inAngleZ = 90;
1193             outDeltaZ = -90;
1194             outAngleZ = 0;
1195         }
1196 
1197         inA = cc.Sequence.create(
1198             cc.DelayTime.create(this._duration / 2),
1199             cc.Spawn.create(
1200                 cc.OrbitCamera.create(this._duration / 2, 1, 0, inAngleZ, inDeltaZ, -45, 0),
1201                 cc.ScaleTo.create(this._duration / 2, 1), cc.Show.create()),
1202             cc.Show.create(),
1203             cc.CallFunc.create(this.finish, this));
1204         outA = cc.Sequence.create(
1205             cc.Spawn.create(
1206                 cc.OrbitCamera.create(this._duration / 2, 1, 0, outAngleZ, outDeltaZ, 45, 0),
1207                 cc.ScaleTo.create(this._duration / 2, 0.5)),
1208             cc.Hide.create(), cc.DelayTime.create(this._duration / 2));
1209 
1210         this._inScene.scale = 0.5;
1211         this._inScene.runAction(inA);
1212         this._outScene.runAction(outA);
1213     }
1214 });
1215 
1216 /**
1217  *  Flips the screen half horizontally and half vertically doing a little zooming out/in.<br/>
1218  * The front face is the outgoing scene and the back face is the incoming scene.
1219  * @param {Number} t time in seconds
1220  * @param {cc.Scene} scene
1221  * @param {cc.TRANSITION_ORIENTATION_LEFT_OVER|cc.TRANSITION_ORIENTATION_RIGHT_OVER|cc.TRANSITION_ORIENTATION_UP_OVER|cc.TRANSITION_ORIENTATION_DOWN_OVER} o
1222  * @return {cc.TransitionZoomFlipAngular}
1223  * @example
1224  * // Example
1225  * var myTransition = cc.TransitionZoomFlipAngular.create(1.5, nextScene)//default is cc.TRANSITION_ORIENTATION_RIGHT_OVER
1226  *
1227  * //OR
1228  * var myTransition = cc.TransitionZoomFlipAngular.create(1.5, nextScene, cc.TRANSITION_ORIENTATION_DOWN_OVER)
1229  */
1230 cc.TransitionZoomFlipAngular.create = function (t, scene, o) {
1231     if (o == null)
1232         o = cc.TRANSITION_ORIENTATION_RIGHT_OVER;
1233 
1234     var tempScene = new cc.TransitionZoomFlipAngular();
1235     tempScene.initWithDuration(t, scene, o);
1236 
1237     return tempScene;
1238 };
1239 
1240 /**
1241  * Fade out the outgoing scene and then fade in the incoming scene.
1242  * @class
1243  * @extends cc.TransitionScene
1244  */
1245 cc.TransitionFade = cc.TransitionScene.extend(/** @lends cc.TransitionFade# */{
1246     _color:null,
1247 
1248     /**
1249      * Constructor
1250      */
1251     ctor:function () {
1252         cc.TransitionScene.prototype.ctor.call(this);
1253         this._color = cc.color()
1254     },
1255 
1256     /**
1257      * custom on enter
1258      */
1259     onEnter:function () {
1260         cc.TransitionScene.prototype.onEnter.call(this);
1261 
1262         var l = cc.LayerColor.create(this._color);
1263         this._inScene.visible = false;
1264 
1265         this.addChild(l, 2, cc.SCENE_FADE);
1266         var f = this.getChildByTag(cc.SCENE_FADE);
1267 
1268         var a = cc.Sequence.create(
1269             cc.FadeIn.create(this._duration / 2),
1270             cc.CallFunc.create(this.hideOutShowIn, this), //CCCallFunc.actionWithTarget:self selector:@selector(hideOutShowIn)],
1271             cc.FadeOut.create(this._duration / 2),
1272             cc.CallFunc.create(this.finish, this) //:self selector:@selector(finish)],
1273         );
1274         f.runAction(a);
1275     },
1276 
1277     /**
1278      * custom on exit
1279      */
1280     onExit:function () {
1281         cc.TransitionScene.prototype.onExit.call(this);
1282         this.removeChildByTag(cc.SCENE_FADE, false);
1283     },
1284 
1285     /**
1286      * initializes the transition with a duration and with an RGB color
1287      * @param {Number} t time in seconds
1288      * @param {cc.Scene} scene
1289      * @param {cc.Color} color
1290      * @return {Boolean}
1291      */
1292     initWithDuration:function (t, scene, color) {
1293         color = color || cc.color.BLACK;
1294         if (cc.TransitionScene.prototype.initWithDuration.call(this, t, scene)) {
1295             this._color.r = color.r;
1296             this._color.g = color.g;
1297             this._color.b = color.b;
1298             this._color.a = 0;
1299         }
1300         return true;
1301     }
1302 });
1303 
1304 
1305 /**
1306  * Fade out the outgoing scene and then fade in the incoming scene.
1307  * @param {Number} t time in seconds
1308  * @param {cc.Scene} scene
1309  * @param {cc.Color} color
1310  * @return {cc.TransitionFade}
1311  * @example
1312  * // Example
1313  * var myTransition = cc.TransitionFade.create(1.5, nextScene, cc.color(255,0,0))//fade to red
1314  */
1315 cc.TransitionFade.create = function (t, scene, color) {
1316     var transition = new cc.TransitionFade();
1317     transition.initWithDuration(t, scene, color);
1318     return transition;
1319 };
1320 
1321 /**
1322  * Cross fades two scenes using the cc.RenderTexture object.
1323  * @class
1324  * @extends cc.TransitionScene
1325  */
1326 cc.TransitionCrossFade = cc.TransitionScene.extend(/** @lends cc.TransitionCrossFade# */{
1327     /**
1328      * custom on enter
1329      */
1330     onEnter:function () {
1331         cc.TransitionScene.prototype.onEnter.call(this);
1332 
1333         // create a transparent color layer
1334         // in which we are going to add our rendertextures
1335         var color = cc.color(0, 0, 0, 0);
1336         var winSize = cc.director.getWinSize();
1337         var layer = cc.LayerColor.create(color);
1338 
1339         // create the first render texture for inScene
1340         var inTexture = cc.RenderTexture.create(winSize.width, winSize.height);
1341 
1342         if (null == inTexture)
1343             return;
1344 
1345         inTexture.sprite.anchorX = 0.5;
1346 	    inTexture.sprite.anchorY = 0.5;
1347         inTexture.attr({
1348 	        x: winSize.width / 2,
1349 	        y: winSize.height / 2,
1350 	        anchorX: 0.5,
1351 	        anchorY: 0.5
1352         });
1353 
1354         // render inScene to its texturebuffer
1355         inTexture.begin();
1356         this._inScene.visit();
1357         inTexture.end();
1358 
1359         // create the second render texture for outScene
1360         var outTexture = cc.RenderTexture.create(winSize.width, winSize.height);
1361         outTexture.setPosition(winSize.width / 2, winSize.height / 2);
1362 	    outTexture.sprite.anchorX = outTexture.anchorX = 0.5;
1363 	    outTexture.sprite.anchorY = outTexture.anchorY = 0.5;
1364 
1365         // render outScene to its texturebuffer
1366         outTexture.begin();
1367         this._outScene.visit();
1368         outTexture.end();
1369 
1370         inTexture.sprite.setBlendFunc(cc.ONE, cc.ONE);                                             // inScene will lay on background and will not be used with alpha
1371         outTexture.sprite.setBlendFunc(cc.SRC_ALPHA, cc.ONE_MINUS_SRC_ALPHA);                      // we are going to blend outScene via alpha
1372 
1373         // add render textures to the layer
1374         layer.addChild(inTexture);
1375         layer.addChild(outTexture);
1376 
1377         // initial opacity:
1378         inTexture.sprite.opacity = 255;
1379         outTexture.sprite.opacity = 255;
1380 
1381         // create the blend action
1382         var layerAction = cc.Sequence.create(
1383             cc.FadeTo.create(this._duration, 0), cc.CallFunc.create(this.hideOutShowIn, this),
1384             cc.CallFunc.create(this.finish, this)
1385         );
1386 
1387         // run the blend action
1388         outTexture.sprite.runAction(layerAction);
1389 
1390         // add the layer (which contains our two rendertextures) to the scene
1391         this.addChild(layer, 2, cc.SCENE_FADE);
1392     },
1393 
1394     /**
1395      * custom on exit
1396      */
1397     onExit:function () {
1398         this.removeChildByTag(cc.SCENE_FADE, false);
1399         cc.TransitionScene.prototype.onExit.call(this);
1400     },
1401 
1402     /**
1403      * overide draw
1404      */
1405     draw:function () {
1406         // override draw since both scenes (textures) are rendered in 1 scene
1407     }
1408 });
1409 
1410 /**
1411  * Cross fades two scenes using the cc.RenderTexture object.
1412  * @param {Number} t time in seconds
1413  * @param {cc.Scene} scene
1414  * @return {cc.TransitionCrossFade}
1415  * @example
1416  * // Example
1417  * var myTransition = cc.TransitionCrossFade.create(1.5, nextScene)
1418  */
1419 cc.TransitionCrossFade.create = function (t, scene) {
1420     var Transition = new cc.TransitionCrossFade();
1421     Transition.initWithDuration(t, scene);
1422     return Transition;
1423 };
1424 
1425 /**
1426  *  Turn off the tiles of the outgoing scene in random order
1427  * @class
1428  * @extends cc.TransitionScene
1429  */
1430 cc.TransitionTurnOffTiles = cc.TransitionScene.extend(/** @lends cc.TransitionTurnOffTiles# */{
1431     _sceneOrder:function () {
1432         this._isInSceneOnTop = false;
1433     },
1434 
1435     /**
1436      * custom on enter
1437      */
1438     onEnter:function () {
1439         cc.TransitionScene.prototype.onEnter.call(this);
1440         var winSize = cc.director.getWinSize();
1441         var aspect = winSize.width / winSize.height;
1442         var x = 0 | (12 * aspect);
1443         var y = 12;
1444         var toff = cc.TurnOffTiles.create(this._duration, cc.size(x, y));
1445         var action = this.easeActionWithAction(toff);
1446         this._outScene.runAction(cc.Sequence.create(action, cc.CallFunc.create(this.finish, this), cc.StopGrid.create()));
1447     },
1448 
1449     /**
1450      * @param {cc.ActionInterval} action
1451      * @return {cc.ActionInterval}
1452      */
1453     easeActionWithAction:function (action) {
1454         return action;
1455     }
1456 });
1457 
1458 /**
1459  *  Turn off the tiles of the outgoing scene in random order
1460  * @param {Number} t time in seconds
1461  * @param {cc.Scene} scene
1462  * @return {cc.TransitionTurnOffTiles}
1463  * @example
1464  * // Example
1465  * var myTransition = cc.TransitionTurnOffTiles.create(1.5, nextScene)
1466  */
1467 cc.TransitionTurnOffTiles.create = function (t, scene) {
1468     var tempScene = new cc.TransitionTurnOffTiles();
1469     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
1470         return tempScene;
1471     }
1472     return null;
1473 };
1474 
1475 /**
1476  *  The odd columns goes upwards while the even columns goes downwards.
1477  * @class
1478  * @extends cc.TransitionScene
1479  */
1480 cc.TransitionSplitCols = cc.TransitionScene.extend(/** @lends cc.TransitionSplitCols# */{
1481 
1482     /**
1483      * custom on enter
1484      */
1485     onEnter:function () {
1486         cc.TransitionScene.prototype.onEnter.call(this);
1487         this._inScene.visible = false;
1488 
1489         var split = this.action();
1490         var seq = cc.Sequence.create(
1491             split, cc.CallFunc.create(this.hideOutShowIn, this), split.reverse());
1492 
1493         this.runAction(
1494             cc.Sequence.create(this.easeActionWithAction(seq), cc.CallFunc.create(this.finish, this), cc.StopGrid.create())
1495         );
1496     },
1497 
1498     /**
1499      * @param {cc.ActionInterval} action
1500      * @return {cc.EaseInOut}
1501      */
1502     easeActionWithAction:function (action) {
1503         return cc.EaseInOut.create(action, 3.0);
1504     },
1505 
1506     /**
1507      * @return {*}
1508      */
1509     action:function () {
1510         return cc.SplitCols.create(this._duration / 2.0, 3);
1511     }
1512 });
1513 
1514 /**
1515  * The odd columns goes upwards while the even columns goes downwards.
1516  * @param {Number} t time in seconds
1517  * @param {cc.Scene} scene
1518  * @return {cc.TransitionSplitCols}
1519  * @example
1520  * // Example
1521  * var myTransition = cc.TransitionSplitCols.create(1.5, nextScene)
1522  */
1523 cc.TransitionSplitCols.create = function (t, scene) {
1524     var tempScene = new cc.TransitionSplitCols();
1525     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
1526         return tempScene;
1527     }
1528     return null;
1529 };
1530 
1531 /**
1532  *  The odd rows goes to the left while the even rows goes to the right.
1533  * @class
1534  * @extends cc.TransitionSplitCols
1535  */
1536 cc.TransitionSplitRows = cc.TransitionSplitCols.extend(/** @lends cc.TransitionSplitRows# */{
1537     /**
1538      * @return {*}
1539      */
1540     action:function () {
1541         return cc.SplitRows.create(this._duration / 2.0, 3);
1542     }
1543 });
1544 
1545 /**
1546  * The odd rows goes to the left while the even rows goes to the right.
1547  * @param {Number} t time in seconds
1548  * @param {cc.Scene} scene
1549  * @return {cc.TransitionSplitRows}
1550  * @example
1551  * // Example
1552  * var myTransition = cc.TransitionSplitRows.create(1.5, nextScene)
1553  */
1554 cc.TransitionSplitRows.create = function (t, scene) {
1555     var tempScene = new cc.TransitionSplitRows();
1556     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
1557         return tempScene;
1558     }
1559     return null;
1560 };
1561 
1562 /**
1563  *  Fade the tiles of the outgoing scene from the left-bottom corner the to top-right corner.
1564  * @class
1565  * @extends cc.TransitionScene
1566  */
1567 cc.TransitionFadeTR = cc.TransitionScene.extend(/** @lends cc.TransitionFadeTR# */{
1568     _sceneOrder:function () {
1569         this._isInSceneOnTop = false;
1570     },
1571 
1572     /**
1573      * Custom on enter
1574      */
1575     onEnter:function () {
1576         cc.TransitionScene.prototype.onEnter.call(this);
1577 
1578         var winSize = cc.director.getWinSize();
1579         var aspect = winSize.width / winSize.height;
1580         var x = 0 | (12 * aspect);
1581         var y = 12;
1582 
1583         var action = this.actionWithSize(cc.size(x, y));
1584         this._outScene.runAction(
1585             cc.Sequence.create(this.easeActionWithAction(action), cc.CallFunc.create(this.finish, this),
1586                 cc.StopGrid.create())
1587         );
1588     },
1589 
1590     /**
1591      * @param {cc.ActionInterval} action
1592      * @return {cc.ActionInterval}
1593      */
1594     easeActionWithAction:function (action) {
1595         return action;
1596     },
1597 
1598     /**
1599      * @param {cc.Size} size
1600      * @return {*}
1601      */
1602     actionWithSize:function (size) {
1603         return cc.FadeOutTRTiles.create(this._duration, size);
1604     }
1605 });
1606 
1607 /**
1608  *  Fade the tiles of the outgoing scene from the left-bottom corner the to top-right corner.
1609  * @param {Number} t time in seconds
1610  * @param {cc.Scene} scene
1611  * @return {cc.TransitionFadeTR}
1612  * @example
1613  * // Example
1614  * var myTransition = cc.TransitionFadeTR.create(1.5, nextScene)
1615  */
1616 cc.TransitionFadeTR.create = function (t, scene) {
1617     var tempScene = new cc.TransitionFadeTR();
1618     if ((tempScene != null) && (tempScene.initWithDuration(t, scene)))
1619         return tempScene;
1620     return null;
1621 };
1622 
1623 /**
1624  *  Fade the tiles of the outgoing scene from the top-right corner to the bottom-left corner.
1625  * @class
1626  * @extends cc.TransitionFadeTR
1627  */
1628 cc.TransitionFadeBL = cc.TransitionFadeTR.extend(/** @lends cc.TransitionFadeBL# */{
1629 
1630     /**
1631      * @param {cc.Size} size
1632      * @return {*}
1633      */
1634     actionWithSize:function (size) {
1635         return cc.FadeOutBLTiles.create(this._duration, size);
1636     }
1637 });
1638 
1639 /**
1640  * Fade the tiles of the outgoing scene from the top-right corner to the bottom-left corner.
1641  * @param {Number} t time in seconds
1642  * @param {cc.Scene} scene
1643  * @return {cc.TransitionFadeBL}
1644  * @example
1645  * // Example
1646  * var myTransition = cc.TransitionFadeBL.create(1.5, nextScene)
1647  */
1648 cc.TransitionFadeBL.create = function (t, scene) {
1649     var tempScene = new cc.TransitionFadeBL();
1650     if ((tempScene != null) && (tempScene.initWithDuration(t, scene)))
1651         return tempScene;
1652     return null;
1653 };
1654 
1655 /**
1656  * Fade the tiles of the outgoing scene from the top-right corner to the bottom-left corner.
1657  * @class
1658  * @extends cc.TransitionFadeTR
1659  */
1660 cc.TransitionFadeUp = cc.TransitionFadeTR.extend(/** @lends cc.TransitionFadeUp# */{
1661 
1662     /**
1663      * @param {cc.Size} size
1664      * @return {*}
1665      */
1666     actionWithSize:function (size) {
1667         return cc.FadeOutUpTiles.create(this._duration, size);
1668     }
1669 });
1670 
1671 /**
1672  * Fade the tiles of the outgoing scene from the top-right corner to the bottom-left corner.
1673  * @param {Number} t time in seconds
1674  * @param {cc.Scene} scene
1675  * @return {cc.TransitionFadeUp}
1676  * @example
1677  * // Example
1678  * var myTransition = cc.TransitionFadeUp.create(1.5, nextScene)
1679  */
1680 cc.TransitionFadeUp.create = function (t, scene) {
1681     var tempScene = new cc.TransitionFadeUp();
1682     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
1683         return tempScene;
1684     }
1685     return null;
1686 };
1687 
1688 /**
1689  * Fade the tiles of the outgoing scene from the top to the bottom.
1690  * @class
1691  * @extends cc.TransitionFadeTR
1692  */
1693 cc.TransitionFadeDown = cc.TransitionFadeTR.extend(/** @lends cc.TransitionFadeDown# */{
1694 
1695     /**
1696      * @param {cc.Size} size
1697      * @return {*}
1698      */
1699     actionWithSize:function (size) {
1700         return cc.FadeOutDownTiles.create( this._duration, size);
1701     }
1702 });
1703 
1704 /**
1705  * Fade the tiles of the outgoing scene from the top to the bottom.
1706  * @param {Number} t time in seconds
1707  * @param {cc.Scene} scene
1708  * @return {cc.TransitionFadeDown}
1709  * @example
1710  * // Example
1711  * var myTransition = cc.TransitionFadeDown.create(1.5, nextScene)
1712  */
1713 cc.TransitionFadeDown.create = function (t, scene) {
1714     var tempScene = new cc.TransitionFadeDown();
1715     if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
1716         return tempScene;
1717     }
1718     return null;
1719 };
1720