Version 0.6.143, fix X.UI.ScrollBox for iOS3.

[pettanr/clientJs.git] / 0.6.x / js / 20_ui / 20_PageRoot.js

diff --git a/0.6.x/js/20_ui/20_PageRoot.js b/0.6.x/js/20_ui/20_PageRoot.js
index 16521e3..c67f5b0 100644 (file)
--- a/0.6.x/js/20_ui/20_PageRoot.js
+++ b/0.6.x/js/20_ui/20_PageRoot.js
@@ -2,10 +2,10 @@ var X_UI_rootData  = null,
        X_UI_eventBusy = false;
 
 function X_UI_eventRellay( e ){
-       var font    = X.ViewPort.getBaseFontSize(),
-               x       = e.clientX / font,
-               y       = e.clientY / font,
-               type    = X.UI.Event.NameToID[ e.type ],
+       var font    = X_ViewPort_baseFontSize,
+               x       = e.pageX / font, // clientX iOS4- で通らない？
+               y       = e.pageY / font,
+               type    = XUI_Event.NameToID[ e.type ],
                i       = 0,
                data    = X_UI_rootData,
                sysOnly = false,
@@ -16,13 +16,13 @@ function X_UI_eventRellay( e ){
        if( !data || X_UI_eventBusy ) return ret;
        data._eventBusy = true;
        
-       if( type !== '' + X.UI.Event._POINTER_MOVE ){
+       if( type !== '' + XUI_Event._POINTER_MOVE ){
                //console.log( e.type + ' ' + type + ' x:' + x + ', y:' + y );
        };
        
        e.type = type;
 
-       if( data && ( data = data.monopolyNodeData ) && ( ret = data[ 'dispatch' ]( e ) ) & X_Callback_MONOPOLY ){
+       if( data && ( data = data.monopolyNodeData ) && ( ret = data[ 'dispatch' ]( e ) ) & X_Callback_CAPTURE_POINTER ){
                X_UI_eventBusy = false;
                return ret | X_Callback_PREVENT_DEFAULT;
        };
@@ -36,7 +36,7 @@ function X_UI_eventRellay( e ){
        while( data ){
                _ret = data[ 'dispatch' ]( e, sysOnly );
                ret |= _ret;
-               if( _ret & X_Callback_MONOPOLY || _ret & X_Callback_STOP_PROPAGATION || _ret & X_Callback_STOP_NOW ) break; // sysOnly = true;
+               if( _ret & X_Callback_CAPTURE_POINTER || _ret & X_Callback_STOP_PROPAGATION || _ret & X_Callback_STOP_NOW ) break; // sysOnly = true;
                data = data.parentData;
        };
        
@@ -47,14 +47,14 @@ function X_UI_eventRellay( e ){
                };
                if( parent !== X_UI_rootData ){
                        data.hoverClassName && data.xnode[ 'removeClass' ]( data.hoverClassName );
-                       data._listeners && data._listeners[ X.UI.Event.POINTER_OUT ] && data[ 'dispatch' ]( e, X.UI.Event.POINTER_OUT, false ); // new Event
+                       data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_OUT ] && data[ 'dispatch' ]( e, XUI_Event.POINTER_OUT, false ); // new Event
                        delete data.hovering;
                        list.splice( i, 1 );
                        continue;
                };
                if( !data.hovering ){
                        data.hoverClassName && data.xnode.addClassName( data.hoverClassName );
-                       data._listeners && data._listeners[ X.UI.Event.POINTER_IN ] && data[ 'dispatch' ]( e, X.UI.Event.POINTER_IN, true ); // new Event
+                       data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_IN ] && data[ 'dispatch' ]( e, XUI_Event.POINTER_IN, true ); // new Event
                        data.hovering = true;
                };
        };
@@ -67,11 +67,11 @@ function X_UI_eventRellay( e ){
  * 背景画像を読み終える onload で活動開始
  */
 
-X.UI._PageRoot = X.UI._Box.inherits(
+var XUI_PageRoot = XUI_Box.inherits(
        '_PageRoot',
-       X.Class.FINAL | X.Class.PRIVATE_DATA | X.Class.SUPER_ACCESS,
+       X_Class.FINAL | X_Class.PRIVATE_DATA,
        {
-               layout                : X.UI.Layout.Canvas,
+               layout                : XUI_Layout_Canvas,
                
                calcReserved          : false,
                hoverList             : null,
@@ -114,11 +114,11 @@ X.UI._PageRoot = X.UI._Box.inherits(
                        } );
                        
                        // hover や rollover rollout のための move イベントの追加
-                       this.xnodeInteractiveLayer[ 'listen' ]( X.UI.Event.IdToName[ X.UI.Event._POINTER_MOVE ], X_UI_eventRellay );
-                       if( counter[ X.UI.Event._POINTER_MOVE ] ){
-                               ++counter[ X.UI.Event._POINTER_MOVE ];
+                       ( X_UA[ 'IE' ] < 9 ? X_ViewPort_document : X_UA[ 'Opera' ] < 8 ? X_Node_body : X_ViewPort )[ 'listen' ]( 'pointermove', X_UI_eventRellay );
+                       if( counter[ XUI_Event._POINTER_MOVE ] ){
+                               ++counter[ XUI_Event._POINTER_MOVE ];
                        } else {
-                               counter[ X.UI.Event._POINTER_MOVE ] = 1;
+                               counter[ XUI_Event._POINTER_MOVE ] = 1;
                        };
 
                        X_Timer_once( 0, this, this.afterAddToView );
@@ -127,15 +127,7 @@ X.UI._PageRoot = X.UI._Box.inherits(
                        this.xnode[ 'className' ]( 'PageRoot' );
                        
                        this.creationComplete();
-                       X_Timer_once( 0, this, this.doFirstCalc );
-               },
-               
-               doFirstCalc : function(){
-                       this.calculate();
-                       this.phase = 4;
-                       X.ViewPort
-                               [ 'listen' ]( X_EVENT_VIEW_RESIZED, this, this.calculate )
-                               [ 'listen' ]( X_EVENT_BASE_FONT_RESIZED, this, this.calculate );
+                       X_Timer_once( 0, this, XUI_PageRoot_do1stCalculate );
                },
                
                reserveCalc : function(){
@@ -145,12 +137,23 @@ X.UI._PageRoot = X.UI._Box.inherits(
                        };
                },
                calculate : function( e ){
-                       var size = X.ViewPort.getSize(),
-                               font = X.ViewPort.getBaseFontSize(),
-                               w    = size[ 0 ],
-                               h    = size[ 1 ];
-                       this.layout.calculate( this, false, 0, 0, w / font, h / font );
+                       var cancelable = !e || ( e.type !== X_EVENT_VIEW_RESIZED && e.type !== X_EVENT_BASE_FONT_RESIZED ),
+                               size, font, w, h;
+                       
+                       if( this[ 'dispatch' ]( { type : XUI_Event.LAYOUT_BEFORE, 'cancelable' : cancelable } ) & X_Callback_PREVENT_DEFAULT && cancelable ){
+                               return X_Callback_NONE;
+                       };
+                       
+                       size = X[ 'ViewPort' ][ 'getSize' ]();
+                       font = X[ 'ViewPort' ][ 'getBaseFontSize' ]();
+                       this.layout.calculate( this, false, 0, 0, size[ 0 ] / font, size[ 1 ] / font );
+                       this.updateLayout();
+                       
                        this.calcReserved = false;
+                       
+                       X_ViewPort[ 'listenOnce' ]( X_EVENT_AFTER_UPDATE, this, XUI_PageRoot_onViewUpdate );
+                       
+                       return X_Callback_NONE;
                },
                
                updateCoursor : function( cursor ){
@@ -158,15 +161,27 @@ X.UI._PageRoot = X.UI._Box.inherits(
                },
                
                _remove : function(){
-                       this.xnodeInteractiveLayer[ 'unlisten' ]();
+                       X_EventDispatcher_unlistenAll( this.xnodeInteractiveLayer );
                        _Box.prototype._remove.call( this );
                }
        }
 );
 
+function XUI_PageRoot_do1stCalculate(){
+       this.calculate();
+       this.phase = 4;
+       X.ViewPort
+               [ 'listen' ]( X_EVENT_VIEW_RESIZED, this, this.calculate )
+               [ 'listen' ]( X_EVENT_BASE_FONT_RESIZED, this, this.calculate );
+};
+
+function XUI_PageRoot_onViewUpdate( e ){
+       this[ 'dispatch' ]( XUI_Event.LAYOUT_COMPLETE );
+};
+
 X.UI.PageRoot = X.UI.Box.presets(
        'PageRoot',
-       X.UI._PageRoot,
+       XUI_PageRoot,
        {
                width  : '100%',
                height : '100%'