OSDN Git Service

Version 0.6.200, fix X.Node.Anime.
[pettanr/clientJs.git] / 0.6.x / js / 20_ui / 15_ScrollBox.js
index 4948a7b..1770704 100644 (file)
@@ -9,33 +9,55 @@ var XUI_ScrollBox_current,
 \r
 function XUI_ScrollBox_start( scrollBox ){\r
        // 既存スクロールの停止\r
-       if( scrollBox.hasVScroll ){\r
+       if( XUI_ScrollBox_current && XUI_ScrollBox_current !== scrollBox ){\r
+               XUI_ScrollBox_indicatorV &&\r
+               XUI_ScrollBox_current[ 'unlisten' ]( [ X_EVENT_CANCELED, XUI_Event.SCROLL_END ], XUI_ScrollBox_indicatorV, XUI_ScrollBox_indicatorHandleEvent );\r
+               \r
+               XUI_ScrollBox_indicatorH &&\r
+               XUI_ScrollBox_current[ 'unlisten' ]( [ X_EVENT_CANCELED, XUI_Event.SCROLL_END ], XUI_ScrollBox_indicatorH, XUI_ScrollBox_indicatorHandleEvent );\r
+       };\r
+\r
+       if( scrollBox && scrollBox.hasVScroll ){\r
                if( !XUI_ScrollBox_indicatorV ){\r
                        XUI_ScrollBox_indicatorV = X_Doc_create( 'div' )[ 'className' ]( 'ScrollBox-IndicatorV' );\r
-                       \r
                };\r
-               XUI_ScrollBox_indicatorV.parent !== scrollBox.xnode && scrollBox.xnode[ 'append' ]( XUI_ScrollBox_indicatorV );\r
-               XUI_ScrollBox_indicatorV[ 'animate' ](\r
-                               { opacity : 0 },\r
-                               { opacity : 1 },\r
-                               900, 'circular', 300\r
-                       );\r
-               scrollBox\r
-                       [ 'listenOnce' ]( [ X_EVENT_CANCELED, XUI_Event.SCROLL_END ], XUI_ScrollBox_indicatorV, XUI_ScrollBox_indicatorHandleEvent );\r
+               if( scrollBox.xnode !== XUI_ScrollBox_indicatorV.parent ){\r
+                       console.log( '*** Scroll Indicator add ***' );\r
+                       scrollBox.xnode[ 'append' ]( XUI_ScrollBox_indicatorV );\r
+                       XUI_ScrollBox_indicatorV[ 'animate' ](\r
+                                       { opacity : 0 },\r
+                                       { opacity : 1 },\r
+                                       900, 'circular', 300\r
+                               );\r
+                       scrollBox\r
+                               [ 'listen' ]( [ X_EVENT_CANCELED, XUI_Event.SCROLL_END ], XUI_ScrollBox_indicatorV, XUI_ScrollBox_indicatorHandleEvent );\r
+               };\r
+       } else\r
+       if( XUI_ScrollBox_indicatorV ){\r
+               console.log( '*** Scroll Indicator remove ***' );\r
+               XUI_ScrollBox_indicatorV[ 'remove' ]();\r
        };\r
-       if( scrollBox.hasHScroll ){\r
+       \r
+       if( scrollBox && scrollBox.hasHScroll ){\r
                if( !XUI_ScrollBox_indicatorH ){\r
                        XUI_ScrollBox_indicatorH = X_Doc_create( 'div' )[ 'className' ]( 'ScrollBox-IndicatorH' );\r
                };\r
-               XUI_ScrollBox_indicatorH.parent !== scrollBox.xnode && scrollBox.xnode[ 'append' ]( XUI_ScrollBox_indicatorH );\r
-               XUI_ScrollBox_indicatorH[ 'animate' ](\r
-                               { opacity : 0 },\r
-                               { opacity : 1 },\r
-                               900, 'circular', 300\r
-                       );\r
-               scrollBox\r
-                       [ 'listenOnce' ]( [ X_EVENT_CANCELED, XUI_Event.SCROLL_END ], XUI_ScrollBox_indicatorH, XUI_ScrollBox_indicatorHandleEvent );\r
+               if( scrollBox.xnode !== XUI_ScrollBox_indicatorH.parent ){                      \r
+                       scrollBox.xnode[ 'append' ]( XUI_ScrollBox_indicatorH );\r
+                       XUI_ScrollBox_indicatorH[ 'animate' ](\r
+                                       { opacity : 0 },\r
+                                       { opacity : 1 },\r
+                                       900, 'circular', 300\r
+                               );\r
+                       scrollBox\r
+                               [ 'listen' ]( [ X_EVENT_CANCELED, XUI_Event.SCROLL_END ], XUI_ScrollBox_indicatorH, XUI_ScrollBox_indicatorHandleEvent );                       \r
+               };\r
+       } else\r
+       if( XUI_ScrollBox_indicatorH ){\r
+               XUI_ScrollBox_indicatorH[ 'remove' ]();\r
        };\r
+       \r
+       XUI_ScrollBox_current = scrollBox;\r
 };\r
 \r
 function XUI_ScrollBox_indicatorHandleEvent( e ){\r
@@ -156,7 +178,7 @@ var XUI_ScrollBox = XUI_ChromeBox.inherits(
                                        this.lastBoxWidth    !== this.boxWidth    || this.lastBoxHeight    !== this.boxHeight\r
                                ){\r
                                        console.log( 'scroll - calc' );\r
-                                       X_UI_rootData[ 'listenOnce' ]( XUI_Event.LAYOUT_COMPLETE, this, X_UI_ScrollBox_onLayoutComplete );\r
+                                       XUI_rootData[ 'listenOnce' ]( XUI_Event.LAYOUT_COMPLETE, this, X_UI_ScrollBox_onLayoutComplete );\r
                                };\r
                },\r
        \r
@@ -174,8 +196,22 @@ var XUI_ScrollBox = XUI_ChromeBox.inherits(
                \r
                _remove : function(){\r
                        XUI_AbstractUINode.prototype._remove.apply( this, arguments );\r
+                       \r
                        if( this.scrolling ){\r
-                               // remove scroll\r
+                               // scroller 削除\r
+                               this[ 'unlisten' ]( XUI_Event._POINTER_DOWN, X_UI_ScrollBox_onStart )\r
+                                       [ 'unlisten' ]( XUI_Event.DRAG, X_UI_ScrollBox_onMove )\r
+                                       [ 'unlisten' ]( XUI_Event.DRAG_END, X_UI_ScrollBox_onEnd );\r
+                               XUI_rootData[ 'unlisten' ]( XUI_Event.LAYOUT_BEFORE, this, X_UI_ScrollBox_onLayoutBefore );\r
+                               \r
+                               XUI_rootData[ 'unlisten' ]( XUI_Event.LAYOUT_COMPLETE, this, X_UI_ScrollBox_onLayoutComplete );\r
+                               this[ 'unlisten' ]( XUI_Event.SCROLL_END, XUI_rootData, XUI_rootData.calculate );\r
+                               \r
+                               this.xnodeSlider[ 'stop' ]();\r
+                               \r
+                               XUI_ScrollBox_current === this && XUI_ScrollBox_start( null );\r
+                               \r
+                               this.scrolling = false;\r
                        };\r
                }\r
                \r
@@ -183,8 +219,8 @@ var XUI_ScrollBox = XUI_ChromeBox.inherits(
 );\r
 \r
 function X_UI_ScrollBox_onLayoutBefore( e ){\r
-       if( e[ 'cancelable' ] && this.isInTransition && X_Node_Anime_translateZ ){\r
-               this[ 'listenOnce' ]( XUI_Event.SCROLL_END, X_UI_rootData, X_UI_rootData.calculate );\r
+       if( e[ 'cancelable' ] && this.isInTransition && X_NodeAnime_translateZ ){\r
+               this[ 'listenOnce' ]( XUI_Event.SCROLL_END, XUI_rootData, XUI_rootData.calculate );\r
                return X_CALLBACK_PREVENT_DEFAULT;\r
        };\r
        this.scrollXRatio = this.scrollX / this.scrollXMax;\r
@@ -224,12 +260,10 @@ function X_UI_ScrollBox_onLayoutComplete( e ){
                        X_UI_ScrollBox_translate( this, this.scrollXMax * this.scrollXRatio, this.scrollYMax * this.scrollYRatio, 100, '', 300 );\r
                } else {\r
                        // scroller 作る\r
-                       // shadow の listen には this が必要!\r
-                       // TODO AbstractUI の listen が悪い!\r
-                       this[ 'listen' ]( XUI_Event._POINTER_DOWN, this, X_UI_ScrollBox_onStart )\r
-                               [ 'listen' ]( XUI_Event.DRAG, this, X_UI_ScrollBox_onMove );\r
-       this[ 'listen' ]( XUI_Event.DRAG_END, this, X_UI_ScrollBox_onEnd );\r
-                       X_UI_rootData[ 'listen' ]( XUI_Event.LAYOUT_BEFORE, this, X_UI_ScrollBox_onLayoutBefore );\r
+                       this[ 'listen' ]( XUI_Event._POINTER_DOWN, X_UI_ScrollBox_onStart )\r
+                               [ 'listen' ]( XUI_Event.DRAG, X_UI_ScrollBox_onMove )\r
+                               [ 'listen' ]( XUI_Event.DRAG_END, X_UI_ScrollBox_onEnd );\r
+                       XUI_rootData[ 'listen' ]( XUI_Event.LAYOUT_BEFORE, this, X_UI_ScrollBox_onLayoutBefore );\r
                        \r
                        X_UI_ScrollBox_translate( this, this.scrollXMax * this.scrollXRatio, this.scrollYMax * this.scrollYRatio, 100, '', 300 );\r
                        this.scrolling = true;\r
@@ -238,10 +272,10 @@ function X_UI_ScrollBox_onLayoutComplete( e ){
        // scroll 不要\r
        if( this.scrolling ){\r
                // scroller 削除\r
-               this[ 'unlisten' ]( XUI_Event._POINTER_DOWN, this, X_UI_ScrollBox_onStart )\r
-                       [ 'unlisten' ]( XUI_Event.DRAG, this, X_UI_ScrollBox_onMove );\r
-       this[ 'unlisten' ]( XUI_Event.DRAG_END, this, X_UI_ScrollBox_onEnd );\r
-               X_UI_rootData[ 'unlisten' ]( XUI_Event.LAYOUT_BEFORE, this, X_UI_ScrollBox_onLayoutBefore );\r
+               this[ 'unlisten' ]( XUI_Event._POINTER_DOWN, X_UI_ScrollBox_onStart )\r
+                       [ 'unlisten' ]( XUI_Event.DRAG, X_UI_ScrollBox_onMove )\r
+                       [ 'unlisten' ]( XUI_Event.DRAG_END, X_UI_ScrollBox_onEnd );\r
+               XUI_rootData[ 'unlisten' ]( XUI_Event.LAYOUT_BEFORE, this, X_UI_ScrollBox_onLayoutBefore );\r
                \r
                ( this.scrollX !== 0 || this.scrollY !== 0 ) && X_UI_ScrollBox_translate( this, 0, 0, 100, '', 300 );\r
                \r
@@ -278,7 +312,7 @@ function X_UI_ScrollBox_translate( that, x, y, opt_time, opt_easing, opt_release
                XUI_ScrollBox_indicatorH && XUI_ScrollBox_indicatorH[ 'css' ]( 'top' , ( scrollBoxH - that.fontSize * 0.6 | 0 ) + 'px' );\r
        };\r
 \r
-       if( that.hasVScroll && XUI_ScrollBox_indicatorV ){\r
+       if( that.hasVScroll && XUI_ScrollBox_indicatorV && XUI_ScrollBox_indicatorV.parent === that.xnode ){\r
                indicatorH = scrollBoxH * scrollBoxH / ( - that.scrollYMax + scrollBoxH );\r
                scrollBoxH -= indicatorH;\r
 \r
@@ -297,7 +331,7 @@ function X_UI_ScrollBox_translate( that, x, y, opt_time, opt_easing, opt_release
                        opt_time, opt_easing, opt_release\r
                );\r
        };\r
-       if( that.hasHScroll && XUI_ScrollBox_indicatorH ){\r
+       if( that.hasHScroll && XUI_ScrollBox_indicatorH && XUI_ScrollBox_indicatorH.parent === that.xnode ){\r
                indicatorW = scrollBoxW * scrollBoxW / ( - that.scrollXMax + scrollBoxW );\r
                scrollBoxW -= indicatorW;\r
                XUI_ScrollBox_indicatorH\r
@@ -316,8 +350,10 @@ function X_UI_ScrollBox_translate( that, x, y, opt_time, opt_easing, opt_release
                );\r
        };\r
        \r
-       that.scrollX = x;\r
-       that.scrollY = y;\r
+       that.scrollX   = x;\r
+       that.scrollXEm = x / that.fontSize;\r
+       that.scrollY   = y;\r
+       that.scrollYEm = y / that.fontSize;\r
 };\r
 \r
 function X_UI_ScrollBox_onStart( e ){\r
@@ -371,7 +407,7 @@ function X_UI_ScrollBox_onMove( e ){
        };\r
 \r
        // gpu の用意\r
-       if( !this.xnodeSlider[ '_anime' ] ){\r
+       if( !this.xnodeSlider[ '_anime' ] || !this.xnodeSlider[ '_anime' ].phase ){\r
                //console.log( 'gpuレイヤーの用意 ' + e.pageY );\r
                //console.log( 'mov1 x:' + this.scrollX + ' y:' + this.scrollY );\r
                X_UI_ScrollBox_translate( this, this.scrollX, this.scrollY, 0, '', 300 );\r
@@ -524,6 +560,7 @@ function X_UI_ScrollBox_onEnd( e ){
                //console.log( '-3-' );\r
                this[ 'dispatch' ]( XUI_Event.SCROLL_END );             \r
        };\r
+\r
        return ret | X_CALLBACK_PREVENT_DEFAULT | X_CALLBACK_RELEASE_POINTER;\r
 };\r
 \r
@@ -560,11 +597,7 @@ function X_UI_ScrollBox_resetPosition( that, time ){
 };\r
 \r
 function X_UI_ScrollBox_onAnimeEnd( e ){\r
-       if( e.target !== this.xnodeSlider ){\r
-               console.log( '- not much -' );\r
-               console.dir(e);\r
-       };\r
-       if( e.target === this.xnodeSlider && this.isInTransition && !X_UI_ScrollBox_resetPosition( this, this.bounceTime ) ){\r
+       if( this.isInTransition && !X_UI_ScrollBox_resetPosition( this, this.bounceTime ) ){\r
                this.isInTransition = false;\r
                //console.log( '-2-' );\r
                this[ 'dispatch' ]( XUI_Event.SCROLL_END );\r