CCTransitionProgress.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467
  1. /****************************************************************************
  2. Copyright (c) 2008-2010 Ricardo Quesada
  3. Copyright (c) 2011-2012 cocos2d-x.org
  4. Copyright (c) 2013-2014 Chukong Technologies Inc.
  5. http://www.cocos2d-x.org
  6. Permission is hereby granted, free of charge, to any person obtaining a copy
  7. of this software and associated documentation files (the "Software"), to deal
  8. in the Software without restriction, including without limitation the rights
  9. to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  10. copies of the Software, and to permit persons to whom the Software is
  11. furnished to do so, subject to the following conditions:
  12. The above copyright notice and this permission notice shall be included in
  13. all copies or substantial portions of the Software.
  14. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  15. IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  16. FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  17. AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  18. LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  19. OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
  20. THE SOFTWARE.
  21. ****************************************************************************/
  22. /**
  23. * tag for scene redial
  24. * @constant
  25. * @type Number
  26. */
  27. cc.SCENE_RADIAL = 0xc001;
  28. /**
  29. * cc.TransitionProgress transition.
  30. * @class
  31. * @extends cc.TransitionScene
  32. * @param {Number} t time
  33. * @param {cc.Scene} scene
  34. * @example
  35. * var trans = new cc.TransitionProgress(time,scene);
  36. */
  37. cc.TransitionProgress = cc.TransitionScene.extend(/** @lends cc.TransitionProgress# */{
  38. _to:0,
  39. _from:0,
  40. _sceneToBeModified:null,
  41. _className:"TransitionProgress",
  42. /**
  43. * @param {Number} t time
  44. * @param {cc.Scene} scene
  45. */
  46. ctor:function (t, scene) {
  47. cc.TransitionScene.prototype.ctor.call(this);
  48. scene && this.initWithDuration(t, scene);
  49. },
  50. _setAttrs: function(node, x, y) {
  51. node.attr({
  52. x: x,
  53. y: y,
  54. anchorX: 0.5,
  55. anchorY: 0.5
  56. });
  57. },
  58. /**
  59. * @override
  60. * custom on enter
  61. */
  62. onEnter:function () {
  63. cc.TransitionScene.prototype.onEnter.call(this);
  64. this._setupTransition();
  65. // create a transparent color layer
  66. // in which we are going to add our rendertextures
  67. var winSize = cc.director.getWinSize();
  68. // create the second render texture for outScene
  69. var texture = cc.RenderTexture.create(winSize.width, winSize.height);
  70. texture.sprite.anchorX = 0.5;
  71. texture.sprite.anchorY = 0.5;
  72. this._setAttrs(texture, winSize.width / 2, winSize.height / 2);
  73. // render outScene to its texturebuffer
  74. texture.clear(0, 0, 0, 1);
  75. texture.begin();
  76. this._sceneToBeModified.visit();
  77. texture.end();
  78. // Since we've passed the outScene to the texture we don't need it.
  79. if (this._sceneToBeModified == this._outScene)
  80. this.hideOutShowIn();
  81. // We need the texture in RenderTexture.
  82. var pNode = this._progressTimerNodeWithRenderTexture(texture);
  83. // create the blend action
  84. var layerAction = cc.sequence(
  85. cc.progressFromTo(this._duration, this._from, this._to),
  86. cc.callFunc(this.finish, this));
  87. // run the blend action
  88. pNode.runAction(layerAction);
  89. // add the layer (which contains our two rendertextures) to the scene
  90. this.addChild(pNode, 2, cc.SCENE_RADIAL);
  91. },
  92. /**
  93. * @override
  94. * custom on exit
  95. */
  96. onExit:function () {
  97. // remove our layer and release all containing objects
  98. this.removeChildByTag(cc.SCENE_RADIAL, true);
  99. cc.TransitionScene.prototype.onExit.call(this);
  100. },
  101. _setupTransition:function () {
  102. this._sceneToBeModified = this._outScene;
  103. this._from = 100;
  104. this._to = 0;
  105. },
  106. _progressTimerNodeWithRenderTexture:function (texture) {
  107. cc.log("cc.TransitionProgress._progressTimerNodeWithRenderTexture(): should be overridden in subclass");
  108. return null;
  109. },
  110. _sceneOrder:function () {
  111. this._isInSceneOnTop = false;
  112. }
  113. });
  114. /**
  115. * create a cc.TransitionProgress object
  116. * @deprecated since v3.0,please use new cc.TransitionProgress(t, scene) instead.
  117. * @function
  118. * @param {Number} t time
  119. * @param {cc.Scene} scene
  120. * @return {cc.TransitionProgress}
  121. * @example
  122. * var trans = cc.TransitionProgress.create(time,scene);
  123. */
  124. cc.TransitionProgress.create = function (t, scene) {
  125. return new cc.TransitionProgress(t, scene);
  126. };
  127. /**
  128. * cc.TransitionRadialCCW transition.<br/>
  129. * A counter clock-wise radial transition to the next scene
  130. * @class
  131. * @extends cc.TransitionProgress
  132. * @param {Number} t time
  133. * @param {cc.Scene} scene
  134. * @example
  135. * var trans = new cc.TransitionProgressRadialCCW(t, scene);
  136. */
  137. cc.TransitionProgressRadialCCW = cc.TransitionProgress.extend(/** @lends cc.TransitionProgressRadialCCW# */{
  138. /**
  139. * @param {Number} t time
  140. * @param {cc.Scene} scene
  141. */
  142. ctor:function (t, scene) {
  143. cc.TransitionProgress.prototype.ctor.call(this);
  144. scene && this.initWithDuration(t, scene);
  145. },
  146. _progressTimerNodeWithRenderTexture:function (texture) {
  147. var size = cc.director.getWinSize();
  148. var pNode = cc.ProgressTimer.create(texture.sprite);
  149. // but it is flipped upside down so we flip the sprite
  150. if (cc._renderType === cc._RENDER_TYPE_WEBGL)
  151. pNode.sprite.flippedY = true;
  152. pNode.type = cc.ProgressTimer.TYPE_RADIAL;
  153. // Return the radial type that we want to use
  154. pNode.reverseDir = false;
  155. pNode.percentage = 100;
  156. this._setAttrs(pNode, size.width / 2, size.height / 2);
  157. return pNode;
  158. }
  159. });
  160. /**
  161. * create a cc.TransitionProgressRadialCCW object
  162. * @deprecated since v3.0,please use new cc.TransitionProgressRadialCCW(t, scene) instead.
  163. * @param {Number} t time
  164. * @param {cc.Scene} scene
  165. * @return {cc.TransitionProgressRadialCCW}
  166. * @example
  167. * var trans = cc.TransitionProgressRadialCCW.create(time,scene);
  168. */
  169. cc.TransitionProgressRadialCCW.create = function (t, scene) {
  170. return new cc.TransitionProgressRadialCCW(t, scene);
  171. };
  172. /**
  173. * cc.TransitionRadialCW transition.<br/>
  174. * A counter colock-wise radial transition to the next scene
  175. * @class
  176. * @extends cc.TransitionProgress
  177. * @param {Number} t time
  178. * @param {cc.Scene} scene
  179. * @example
  180. * var trans = new cc.TransitionProgressRadialCW(t, scene);
  181. */
  182. cc.TransitionProgressRadialCW = cc.TransitionProgress.extend(/** @lends cc.TransitionProgressRadialCW# */{
  183. /**
  184. * @param {Number} t time
  185. * @param {cc.Scene} scene
  186. */
  187. ctor:function (t, scene) {
  188. cc.TransitionProgress.prototype.ctor.call(this);
  189. scene && this.initWithDuration(t, scene);
  190. },
  191. _progressTimerNodeWithRenderTexture:function (texture) {
  192. var size = cc.director.getWinSize();
  193. var pNode = cc.ProgressTimer.create(texture.sprite);
  194. // but it is flipped upside down so we flip the sprite
  195. if (cc._renderType === cc._RENDER_TYPE_WEBGL)
  196. pNode.sprite.flippedY = true;
  197. pNode.type = cc.ProgressTimer.TYPE_RADIAL;
  198. // Return the radial type that we want to use
  199. pNode.reverseDir = true;
  200. pNode.percentage = 100;
  201. this._setAttrs(pNode, size.width / 2, size.height / 2);
  202. return pNode;
  203. }
  204. });
  205. /**
  206. * create a cc.TransitionProgressRadialCW object
  207. * @deprecated since v3.0,please use cc.TransitionProgressRadialCW(t, scene) instead.
  208. * @param {Number} t time
  209. * @param {cc.Scene} scene
  210. * @return {cc.TransitionProgressRadialCW}
  211. * @example
  212. * var trans = cc.TransitionProgressRadialCW.create(time,scene);
  213. */
  214. cc.TransitionProgressRadialCW.create = function (t, scene) {
  215. var tempScene = new cc.TransitionProgressRadialCW();
  216. if ((tempScene != null) && (tempScene.initWithDuration(t, scene))) {
  217. return tempScene;
  218. }
  219. return new cc.TransitionProgressRadialCW(t, scene);
  220. };
  221. /**
  222. * cc.TransitionProgressHorizontal transition.<br/>
  223. * A colock-wise radial transition to the next scene
  224. * @class
  225. * @extends cc.TransitionProgress
  226. * @param {Number} t time
  227. * @param {cc.Scene} scene
  228. * @example
  229. * var trans = new cc.TransitionProgressHorizontal(t, scene);
  230. */
  231. cc.TransitionProgressHorizontal = cc.TransitionProgress.extend(/** @lends cc.TransitionProgressHorizontal# */{
  232. /**
  233. * @param {Number} t time
  234. * @param {cc.Scene} scene
  235. */
  236. ctor:function (t, scene) {
  237. cc.TransitionProgress.prototype.ctor.call(this);
  238. scene && this.initWithDuration(t, scene);
  239. },
  240. _progressTimerNodeWithRenderTexture:function (texture) {
  241. var size = cc.director.getWinSize();
  242. var pNode = cc.ProgressTimer.create(texture.sprite);
  243. // but it is flipped upside down so we flip the sprite
  244. if (cc._renderType === cc._RENDER_TYPE_WEBGL)
  245. pNode.sprite.flippedY = true;
  246. pNode.type = cc.ProgressTimer.TYPE_BAR;
  247. pNode.midPoint = cc.p(1, 0);
  248. pNode.barChangeRate = cc.p(1, 0);
  249. pNode.percentage = 100;
  250. this._setAttrs(pNode, size.width / 2, size.height / 2);
  251. return pNode;
  252. }
  253. });
  254. /**
  255. * create a cc.TransitionProgressHorizontal object
  256. * @deprecated since v3.0,please use new cc.TransitionProgressHorizontal(t, scene) instead.
  257. * @param {Number} t time
  258. * @param {cc.Scene} scene
  259. * @return {cc.TransitionProgressHorizontal}
  260. * @example
  261. * var trans = cc.TransitionProgressHorizontal.create(time,scene);
  262. */
  263. cc.TransitionProgressHorizontal.create = function (t, scene) {
  264. return new cc.TransitionProgressHorizontal(t, scene);
  265. };
  266. /**
  267. * cc.TransitionProgressVertical transition.
  268. * @class
  269. * @extends cc.TransitionProgress
  270. * @param {Number} t time
  271. * @param {cc.Scene} scene
  272. * @example
  273. * var trans = new cc.TransitionProgressVertical(t, scene);
  274. */
  275. cc.TransitionProgressVertical = cc.TransitionProgress.extend(/** @lends cc.TransitionProgressVertical# */{
  276. /**
  277. * @param {Number} t time
  278. * @param {cc.Scene} scene
  279. */
  280. ctor:function (t, scene) {
  281. cc.TransitionProgress.prototype.ctor.call(this);
  282. scene && this.initWithDuration(t, scene);
  283. },
  284. _progressTimerNodeWithRenderTexture:function (texture) {
  285. var size = cc.director.getWinSize();
  286. var pNode = cc.ProgressTimer.create(texture.sprite);
  287. // but it is flipped upside down so we flip the sprite
  288. if (cc._renderType === cc._RENDER_TYPE_WEBGL)
  289. pNode.sprite.flippedY = true;
  290. pNode.type = cc.ProgressTimer.TYPE_BAR;
  291. pNode.midPoint = cc.p(0, 0);
  292. pNode.barChangeRate = cc.p(0, 1);
  293. pNode.percentage = 100;
  294. this._setAttrs(pNode, size.width / 2, size.height / 2);
  295. return pNode;
  296. }
  297. });
  298. /**
  299. * create a cc.TransitionProgressVertical object
  300. * @deprecated since v3.0,please use new cc.TransitionProgressVertical(t, scene) instead.
  301. * @param {Number} t time
  302. * @param {cc.Scene} scene
  303. * @return {cc.TransitionProgressVertical}
  304. * @example
  305. * var trans = cc.TransitionProgressVertical.create(time,scene);
  306. */
  307. cc.TransitionProgressVertical.create = function (t, scene) {
  308. return new cc.TransitionProgressVertical(t, scene);
  309. };
  310. /**
  311. * cc.TransitionProgressInOut transition.
  312. * @class
  313. * @extends cc.TransitionProgress
  314. */
  315. cc.TransitionProgressInOut = cc.TransitionProgress.extend(/** @lends cc.TransitionProgressInOut# */{
  316. /**
  317. * The constructor of cc.TransitionProgressInOut. override it to extend the construction behavior, remember to call "this._super()" in the extended "ctor" function.
  318. * @param {Number} t time
  319. * @param {cc.Scene} scene
  320. */
  321. ctor:function (t, scene) {
  322. cc.TransitionProgress.prototype.ctor.call(this);
  323. scene && this.initWithDuration(t, scene);
  324. },
  325. _progressTimerNodeWithRenderTexture:function (texture) {
  326. var size = cc.director.getWinSize();
  327. var pNode = cc.ProgressTimer.create(texture.sprite);
  328. // but it is flipped upside down so we flip the sprite
  329. if (cc._renderType === cc._RENDER_TYPE_WEBGL)
  330. pNode.sprite.flippedY = true;
  331. pNode.type = cc.ProgressTimer.TYPE_BAR;
  332. pNode.midPoint = cc.p(0.5, 0.5);
  333. pNode.barChangeRate = cc.p(1, 1);
  334. pNode.percentage = 0;
  335. this._setAttrs(pNode, size.width / 2, size.height / 2);
  336. return pNode;
  337. },
  338. _sceneOrder:function () {
  339. this._isInSceneOnTop = false;
  340. },
  341. _setupTransition:function () {
  342. this._sceneToBeModified = this._inScene;
  343. this._from = 0;
  344. this._to = 100;
  345. }
  346. });
  347. /**
  348. * create a cc.TransitionProgressInOut object
  349. * @function
  350. * @deprecated
  351. * @param {Number} t time
  352. * @param {cc.Scene} scene
  353. * @return {cc.TransitionProgressInOut}
  354. */
  355. cc.TransitionProgressInOut.create = function (t, scene) {
  356. return new cc.TransitionProgressInOut(t, scene);
  357. };
  358. /**
  359. * cc.TransitionProgressOutIn transition.
  360. * @class
  361. * @extends cc.TransitionProgress
  362. */
  363. cc.TransitionProgressOutIn = cc.TransitionProgress.extend(/** @lends cc.TransitionProgressOutIn# */{
  364. /**
  365. * The constructor of cc.TransitionProgressOutIn. override it to extend the construction behavior, remember to call "this._super()" in the extended "ctor" function.
  366. * @param {Number} t time
  367. * @param {cc.Scene} scene
  368. */
  369. ctor:function (t, scene) {
  370. cc.TransitionProgress.prototype.ctor.call(this);
  371. scene && this.initWithDuration(t, scene);
  372. },
  373. _progressTimerNodeWithRenderTexture:function (texture) {
  374. var size = cc.director.getWinSize();
  375. var pNode = cc.ProgressTimer.create(texture.sprite);
  376. // but it is flipped upside down so we flip the sprite
  377. if (cc._renderType === cc._RENDER_TYPE_WEBGL)
  378. pNode.sprite.flippedY = true;
  379. pNode.type = cc.ProgressTimer.TYPE_BAR;
  380. pNode.midPoint = cc.p(0.5, 0.5);
  381. pNode.barChangeRate = cc.p(1, 1);
  382. pNode.percentage = 100;
  383. this._setAttrs(pNode, size.width / 2, size.height / 2);
  384. return pNode;
  385. }
  386. });
  387. /**
  388. * create a cc.TransitionProgressOutIn object
  389. * @function
  390. * @deprecated
  391. * @param {Number} t time
  392. * @param {cc.Scene} scene
  393. * @return {cc.TransitionProgressOutIn}
  394. */
  395. cc.TransitionProgressOutIn.create = function (t, scene) {
  396. return new cc.TransitionProgressOutIn(t, scene);
  397. };