Version 0.6.145, fix X.Audio, fix VIEW_ACTIVATE Event @X.ViewPort.

[pettanr/clientJs.git] / 0.6.x / js / 02_dom / 10_XNodeAnime.js

diff --git a/0.6.x/js/02_dom/10_XNodeAnime.js b/0.6.x/js/02_dom/10_XNodeAnime.js
index 247fe48..0b5a8a8 100644 (file)
--- a/0.6.x/js/02_dom/10_XNodeAnime.js
+++ b/0.6.x/js/02_dom/10_XNodeAnime.js
@@ -72,7 +72,7 @@ var X_Node_ANIMATIONS            = [],
        X_Node_Anime_transitionProps = X_Node_Anime_hasTransform ? X_Node_CSS_VENDER_PREFIX[ 'transform' ] : 'left,top',\r
        // transitionEnd イベント中に要素の更新( X_Node_startUpdate() )ができるか？\r
        // iOS3+4 では可能、iOS6.1.5 で不可。TODO iOS5　及び他の環境で調査。ダメな場合、anime.html が正しく描画されない。\r
-       X_Node_updateOnTransitionEnd = X_UA[ 'iOS' ] < 6;\r
+       X_Node_updateOnTransitionEnd = false; //X_UA[ 'iOS' ] < 6;\r
 \r
 // gpu化だけ transformX , willChange\r
 // 終了位置の変更\r
@@ -85,6 +85,7 @@ var X_Node_ANIMATIONS            = [],
  * TODO : skew\r
  * TODO : filter\r
  * TODO 前回位置からの継続\r
+ * TODO scrollLeft, scrollTop\r
  */\r
 Node.prototype[ 'animate' ] = function( start, dest, duration, easing, wait ){\r
        var isNew = !this[ '_anime' ],\r
@@ -328,9 +329,12 @@ function X_Node_Anime_updateAnimation( xnode ){
                        \r
                case 3 : // アニメーションの解除\r
                        obj.phase = obj.gpuParent ? 10 : 4;\r
+                       \r
+                       console.log( '#### アニメーションの解除 ' + obj.phase );\r
+                       \r
                        // このタイミングで animation 関連の css を削除したところ(X_Node_Anime_clearTransition)、iOS3、4 で再描画忘れが度々起きるように、、、\r
                        if( !obj.gpuParent ) X_Node_Anime_clearTransition( xnode );\r
-                       xnode[ 'dispatch' ]( { type : X_EVENT_ANIME_END, 'gpu' : obj.gpuParent } );\r
+                       //xnode[ 'dispatch' ]( { type : X_EVENT_ANIME_END, 'gpu' : obj.gpuParent } );\r
                        break;\r
 \r
                case 4 :\r
@@ -342,6 +346,7 @@ function X_Node_Anime_updateAnimation( xnode ){
                        // アニメーションは停止・GPUレイヤーは解除していない(再アニメーションに備えて待機)\r
                        //X_Node_Anime_clearTransition( xnode ); // TODO X_Node_Anime_releaseGPULayer に移動?\r
                        if( !obj.gpuTimerID ){\r
+                               console.log( '#### アニメーションは停止 ' + obj.wait );\r
                                if( obj.wait ){\r
                                        obj.gpuTimerID = X_Timer_once( obj.wait, xnode, X_Node_Anime_releaseGPULayer );\r
                                } else {\r
@@ -365,7 +370,7 @@ function X_Node_Anime_updateAnimation( xnode ){
                                X_Node_Anime_clearTransition( xnode );\r
                                X_Node_Anime_updatePosition( xnode, obj.destX, obj.destY, obj.destA, phase === 14 );\r
                                obj.phase = phase === 14 ? 10 : 4;\r
-                               xnode[ 'dispatch' ]( { type : X_EVENT_ANIME_END, 'gpu' : obj.gpuParent } );\r
+                               xnode[ 'asyncDispatch' ]( time, { type : X_EVENT_ANIME_END, 'gpu' : obj.gpuParent } );\r
                        } else {\r
                                current = X_Node_Anime_getComputedPosition( xnode );\r
                                obj.startX    = current.x;\r
@@ -384,7 +389,8 @@ function X_Node_Anime_updateAnimation( xnode ){
                        // console.log( 'GPU有効で停止（待機）している xnode のGPU解除' );\r
                        X_Node_Anime_clearTransition( xnode );\r
                        X_Node_Anime_updatePosition( xnode, obj.destX, obj.destY, obj.destA, false );\r
-                       obj.gpuTimerID && X_Timer_remove( obj.gpuTimerID );\r
+                       //obj.gpuTimerID && X_Timer_remove( obj.gpuTimerID );\r
+                       //delete obj.gpuTimerID;\r
                        X_ViewPort[ 'listenOnce' ]( X_EVENT_AFTER_UPDATE, xnode, X_Node_Anime_gpuReleased );\r
                        return true;\r
                \r
@@ -418,7 +424,7 @@ function X_Node_Anime_getComputedPosition( that ) {
 };\r
 \r
 function X_Node_Anime_onTransitionEnd( e ){\r
-       // console.log( 'アニメ終了[onTransitionEnd] ' + ( this[ '_anime' ] && this[ '_anime' ].phase ) );\r
+       console.log( '[TransitionEnd] ' + ( this[ '_anime' ] && this[ '_anime' ].phase ) );\r
        \r
        if( !this[ '_anime' ] || this[ '_anime' ].phase !== 2 ){\r
                // ここで return してしまうと、view の更新イベント待ちの場合、アニメが止まる\r
@@ -428,6 +434,8 @@ function X_Node_Anime_onTransitionEnd( e ){
        \r
        this[ '_anime' ].phase = 3;\r
        \r
+       X_Node_Anime_clearTransition( this ); // X_EVENT_ANIME_END より前で呼んでおく\r
+       \r
        X_Node_Anime_onTransition = true;\r
        this[ 'dispatch' ]( { type : X_EVENT_ANIME_END, 'gpu' : this[ '_anime' ].gpuParent } );\r
        X_Node_Anime_onTransition = false;\r
@@ -451,7 +459,7 @@ function X_Node_Anime_releaseGPULayer(){
        X_Node_ANIMATIONS.splice( X_Node_ANIMATIONS.indexOf( this ), 1 );\r
        delete obj.gpuTimerID;\r
        delete this[ '_anime' ];\r
-       //console.log( 'GPUレイヤーの破棄を指示' );\r
+       console.log( 'GPUレイヤーの破棄を指示' );\r
        \r
        X_ViewPort[ 'listenOnce' ]( X_EVENT_AFTER_UPDATE, this, X_Node_Anime_gpuReleased );\r
 };\r
@@ -477,7 +485,7 @@ function X_Node_Anime_clearTransition( xnode ){
 };\r
 \r
 function X_Node_Anime_updatePosition( xnode, x, y, opacity, useGPU ){\r
-       // console.log( 'updatePosition y:' + y + ' gpu:' + !!useGPU );\r
+       console.log( 'updatePosition x:' + x + ' gpu:' + !!useGPU );\r
        if( X_Node_Anime_hasTransform ){\r
                xnode[ 'css' ]({\r
                        transform : 'translate(' + ( x | 0 ) + 'px,' + ( y | 0 ) + 'px)' + ( useGPU ? X_Node_Anime_translateZ : '' ),\r