OSDN Git Service

Version 0.6.187, add Scroll-Indicator for X.UI.ScrollBox, bugfix of X.HTMLAudio.
[pettanr/clientJs.git] / 0.6.x / js / 20_ui / 06_AbstractUINode.js
index 14dea01..63bddf4 100644 (file)
@@ -1,9 +1,12 @@
-X.UI._AbstractUINode = X.EventDispatcher.inherits(\r
+// TODO -> Node[ 'inherits' ]\r
+var XUI_AbstractUINode = X_EventDispatcher[ 'inherits' ](\r
        'X.UI._AbstractUINode',\r
-       X.Class.ABSTRACT | X.Class.PRIVATE_DATA,\r
+       X_Class.ABSTRACT,\r
        {\r
+               itemData          : null,\r
+               \r
                phase             : 0,\r
-               dirty             : X.UI.Dirty.CLEAN,\r
+               dirty             : XUI_Dirty.CLEAN,\r
                \r
                root              : null,\r
                rootData          : null,\r
@@ -12,12 +15,12 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                parentData        : null,\r
                xnode             : null,\r
 \r
-               supportAttrs      : X.UI.Attr.Support,\r
-               attrClass         : X.UI.AttrClass,\r
+               usableAttrs       : XUI_Attr_Support,\r
+               attrClass         : XUI_AttrClass,\r
                attrObject        : null,\r
                unverifiedAttrs   : null,\r
                \r
-               role              : null,\r
+               role              : 1,\r
                pointerDisabled   : false,\r
                hoverClassName    : null,\r
                hovering          : false,\r
@@ -30,33 +33,37 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                \r
                boxX              : 0,\r
                boxY              : 0,\r
-               scrollWidth       : 0,\r
-               scrollHeight      : 0,          \r
-               boxWidth          : X.UI.Attr.AUTO,\r
-               minBoxWidth       : 0,\r
-               maxBoxWidth       : X.UI.Attr.AUTO,     \r
-               boxHeight         : X.UI.Attr.AUTO,\r
-               minBoxHeight      : 0,\r
-               maxBoxHeight      : X.UI.Attr.AUTO,\r
+               boxWidth          : XUI_Attr_AUTO,\r
+               boxWidthMin       : 0,\r
+               boxWidthMax       : XUI_Attr_AUTO,      \r
+               boxHeight         : XUI_Attr_AUTO,\r
+               boxHeightMin      : 0,\r
+               boxHeightMax      : XUI_Attr_AUTO,\r
                contentL          : 0,\r
                contentT          : 0,\r
                contentR          : 0,\r
                contentB          : 0,\r
+               paddingL          : 0,\r
+               paddingT          : 0,\r
+               borderL           : 0,\r
+               borderT           : 0,\r
                boxSizingOffsetLR : 0,\r
                boxSizingOffsetTB : 0,          \r
-               contentWidth      : X.UI.Attr.AUTO,\r
-               minContentWidth   : 0,\r
-               maxContentWidth   : X.UI.Attr.AUTO,\r
-               lastContentWidth  : -1,\r
-               contentHeight     : X.UI.Attr.AUTO,\r
-               minContentHeight  : 0,\r
-               maxContentHeight  : X.UI.Attr.AUTO,\r
-               lastContentHeight : -1,\r
+               contentWidth      : XUI_Attr_AUTO,\r
+               contentWidthMin   : 0,\r
+               contentWidthMax   : XUI_Attr_AUTO,\r
+               contentWidthLast  : -1,\r
+               contentHeight     : XUI_Attr_AUTO,\r
+               contentHeightMin  : 0,\r
+               contentHeightMax  : XUI_Attr_AUTO,\r
+               contentHeightLast : -1,\r
                \r
                constraintW       : false,\r
                constraintH       : false,\r
                autoWidth         : false,\r
                autoHeight        : false,\r
+               noWidth           : false,\r
+               noHeight          : false,\r
                percentWidth      : false,\r
                percentHeight     : false,\r
                // :hover, :focus, :disabled\r
@@ -66,17 +73,29 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                        this.rootData   = rootData;\r
                        this.parent     = parent;\r
                        this.parentData = parentData;\r
-                       //this.xnode      = X_Doc_create( 'div' );\r
                        this.phase      = 1;\r
                        \r
-                       this.dispatch( X.UI.Event.INIT );\r
+                       this[ 'dispatch' ]( XUI_Event.INIT );\r
                },\r
                \r
                addToParent : function( xnodeParent ){\r
-                       xnodeParent && xnodeParent.append( this.xnode );\r
+                       var attr = this.attrObject || this.attrClass.prototype,\r
+                               usableAttrs = this.usableAttrs,\r
+                               i = 0, l = usableAttrs.length, def, k;\r
+                       \r
+                       xnodeParent && xnodeParent[ 'append' ]( this.xnode );\r
+                       \r
+                       if( attr ){\r
+                               for( k in usableAttrs ){\r
+                                       def = usableAttrs[ k ];\r
+                                       if( def[ 2 ] === XUI_Attr_USER.XNODE && X_Object_inObject( def.No, attr ) && attr[ k ] !== def[ 0 ] ){\r
+                                               this.xnode[ 'css' ]( XUI_Attr_Rename[ k ] || k, XUI_AbstractUINode_createCssText( this, k ) );\r
+                                       };\r
+                               };\r
+                       };\r
                        \r
                        this.phase = 2;\r
-                       this.dispatch( X.UI.Event.ADDED );\r
+                       this[ 'dispatch' ]( XUI_Event.ADDED );\r
                },\r
                \r
                creationComplete : function(){\r
@@ -84,9 +103,10 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                l, i;\r
                        \r
                        this.phase = 3;\r
-                       this.User.dispatch( X.UI.Event.CREATION_COMPLETE );\r
+                       this.User[ 'dispatch' ]( XUI_Event.CREATION_COMPLETE );\r
                        \r
                        // html 要素が親に追加されるまで控えていたイベントの登録\r
+                       // TODO listenOnce\r
                        if( events && ( l = events.length ) ){\r
                                for( i = 0; i < l; ++i ){\r
                                        this.listen.apply( this, events[ i ] );\r
@@ -101,50 +121,51 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                 * 親要素が変化した場合、unverifiedAttrs を元に attrObject を再設定.\r
                 */\r
                setAttr : function( name, def, v ){\r
-                       var attrs      = X.UI.attrClassProto || this.attrObject,\r
+                       var attrs      = XUI_attrClassProto || this.attrObject,\r
                                propID     = def.No || def[ 5 ],\r
-                               defaultVal = X.UI.attrClassProto ? attrs[ propID ] : this.attrClass.prototype[ propID ], // def[ 0 ],\r
+                               defaultVal = XUI_attrClassProto ? attrs[ propID ] : this.attrClass.prototype[ propID ], // def[ 0 ],\r
                                currentVal = attrs ? attrs[ propID ] : defaultVal,\r
                                dirty      = def[ 1 ],\r
                                user       = def[ 2 ],\r
                                type       = def[ 3 ],\r
                                list       = def[ 4 ],\r
-                               length     = !!( type & X.UI.Attr.Type.LENGTH        ),\r
-                               minusLen   = !!( type & X.UI.Attr.Type.MINUS_LENGTH  ),\r
-                               percent    = !!( type & X.UI.Attr.Type.PERCENT       ),\r
-                               minusPct   = !!( type & X.UI.Attr.Type.MINUS_PERCENT ),\r
-                               numerical  = !!( type & X.UI.Attr.Type.NUMERICAL     ),\r
-                               auto       = !!( type & X.UI.Attr.Type.AUTO          ),\r
-                               color      = !!( type & X.UI.Attr.Type.COLOR         ),\r
-                               url        = !!( type & X.UI.Attr.Type.URL           ),\r
-                               fontName   = !!( type & X.UI.Attr.Type.FONT_NAME     ),\r
-                               flag       = !!( type & X.UI.Attr.Type.BOOLEAN       ),\r
-                               combi      = !!( type & X.UI.Attr.Type.COMBI         ),\r
-                               quartet    = !!( type & X.UI.Attr.Type.QUARTET       ),\r
+                               length     = !!( type & XUI_Attr_Type.LENGTH        ),\r
+                               minusLen   = !!( type & XUI_Attr_Type.MINUS_LENGTH  ),\r
+                               percent    = !!( type & XUI_Attr_Type.PERCENT       ),\r
+                               minusPct   = !!( type & XUI_Attr_Type.MINUS_PERCENT ),\r
+                               numerical  = !!( type & XUI_Attr_Type.NUMERICAL     ),\r
+                               auto       = !!( type & XUI_Attr_Type.AUTO          ),\r
+                               color      = !!( type & XUI_Attr_Type.COLOR         ),\r
+                               url        = !!( type & XUI_Attr_Type.URL           ),\r
+                               fontName   = !!( type & XUI_Attr_Type.FONT_NAME     ),\r
+                               flag       = !!( type & XUI_Attr_Type.BOOLEAN       ),\r
+                               combi      = !!( type & XUI_Attr_Type.COMBI         ),\r
+                               quartet    = !!( type & XUI_Attr_Type.QUARTET       ),\r
                                _v, i, l, nodes, root, roots;\r
                \r
-                       if( X.Type.isString( v ) ){\r
+                       if( X_Type_isString( v ) ){\r
                                //v = v.toLowercase();\r
                                if( url || fontName ){\r
                                        // good\r
                                } else\r
                                if( auto && v === 'auto' ){\r
-                                       v = X.UI.Attr.AUTO;\r
+                                       v = XUI_Attr_AUTO;\r
                                } else\r
                                if( list && ( _v = list[ v ] ) ){\r
                                        // good\r
+                                       console.log( v + ' ' + _v );\r
                                        v = _v;\r
                                } else\r
-                               if( ( percent || minusPct ) && v.lastIndexOf( '%' ) !== -1 && isFinite( _v = parseFloat( v ) ) && v === _v + '%' ){\r
+                               if( ( percent || minusPct ) && v.lastIndexOf( '%' ) !== -1 && X_Type_isFinite( _v = parseFloat( v ) ) && v === _v + '%' ){\r
                                        // good\r
                                } else\r
-                               if( ( length || minusLen ) && v.lastIndexOf( 'em' ) !== -1 && isFinite( _v = parseFloat( v ) ) && v === _v + 'em' ){\r
+                               if( ( length || minusLen ) && v.lastIndexOf( 'em' ) !== -1 && X_Type_isFinite( _v = parseFloat( v ) ) && v === _v + 'em' ){\r
                                        v = _v;\r
                                } else                          \r
                                if( v.indexOf( ' ' ) !== -1 ){\r
                                        v = v.split( ' ' );\r
                                } else\r
-                               if( color && X.Type.isNumber( _v = X_Node_CSS_objToIEFilterText( v ) ) ){\r
+                               if( color && X_Type_isNumber( _v = X_Node_CSS_objToIEFilterText( v ) ) ){\r
                                        v = _v;\r
                                } else {\r
                                        // bad\r
@@ -152,18 +173,18 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                };\r
                        };\r
                        \r
-                       if( ( quartet || combi ) && !X.Type.isArray( v ) ){\r
+                       if( ( quartet || combi ) && !X_Type_isArray( v ) ){\r
                                v = [ v ];\r
                        };\r
                        \r
-                       if( X.Type.isNumber( v ) ){\r
+                       if( X_Type_isNumber( v ) ){\r
                                if( \r
                                    ( length    && ( 0 <= v ) ) ||\r
                                    ( minusLen  && ( v <= 0 ) ) ||\r
                                    ( percent   && 0 <= v && v <= 1 ) ||\r
                                        ( minusPct  && -1 <= v && v < 0 ) ||\r
                                    ( numerical && 0 <= v ) ||\r
-                                   ( auto      && v === X.UI.Attr.AUTO ) ||\r
+                                   ( auto      && v === XUI_Attr_AUTO ) ||\r
                                    ( color     && 0 <= v && v <= 0xFFFFFF ) ||\r
                                    ( list      && list[ v ] )\r
                                ){\r
@@ -173,12 +194,12 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                        return;\r
                                };\r
                        } else\r
-                       if( X.Type.isBoolean( v ) && !flag ){\r
+                       if( X_Type_isBoolean( v ) && !flag ){\r
                                return;\r
                        } else\r
-                       if( X.Type.isArray( v ) ){\r
+                       if( X_Type_isArray( v ) ){\r
                                if( v.length <= 4 && quartet ){\r
-                                       type &= ~X.UI.Attr.Type.QUARTET;\r
+                                       type &= ~XUI_Attr_Type.QUARTET;\r
                                        switch( v.length ){\r
                                                case 1 :\r
                                                        this.setAttr( false, [ defaultVal, user, dirty, type, list,   propID ], v[ 0 ] );\r
@@ -207,7 +228,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                        };                                      \r
                                } else\r
                                if( v.length === 2 && combi ){\r
-                                       type &= ~X.UI.Attr.Type.COMBI;\r
+                                       type &= ~XUI_Attr_Type.COMBI;\r
                                        this.setAttr( false, [ defaultVal, user, dirty, type, list,   propID ], v[ 0 ] );\r
                                        this.setAttr( false, [ defaultVal, user, dirty, type, list, ++propID ], v[ 1 ] );\r
                                } else {\r
@@ -215,41 +236,42 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                        return;\r
                                };\r
 \r
-                               if( !X.UI.attrClassProto && user === X.UI.Attr.USER.XNODE && this.xnode ){\r
-                                       this.xnode.css( X.UI.Attr.Rename[ name ] || name, this._createCssText( name ) );\r
-                                       //console.log( ( X.UI.Attr.Rename[ name ] || name ) + ' ' + this._createCssText( name ) + ' ' + propID + ' ' + attrs[ propID ] );\r
+                               if( !XUI_attrClassProto && user === XUI_Attr_USER.XNODE && this.xnode ){\r
+                                       this.xnode[ 'css' ]( XUI_Attr_Rename[ name ] || name, XUI_AbstractUINode_createCssText( this, name ) );\r
+                                       //console.log( ( XUI_Attr_Rename[ name ] || name ) + ' ' + XUI_AbstractUINode_createCssText( this, name ) + ' ' + propID + ' ' + attrs[ propID ] );\r
                                };\r
                                return;\r
                        };\r
 \r
                        if( !v && v !== 0 ) v = defaultVal;\r
                        \r
-                       if( X.UI.attrClassProto ){\r
+                       // UIAttrClass の初期設定の場合、ここで終わる\r
+                       if( XUI_attrClassProto ){\r
                                attrs[ propID ] = v;\r
                                return;                 \r
                        };              \r
 \r
                        if( currentVal !== v ){\r
                                switch( propID ){\r
-                                       case X.UI.Attr.Support.left.No :\r
-                                               this.constraintW = attrs[ X.UI.Attr.Support.right.No ] !== null;\r
+                                       case XUI_Attr_Support.left.No :\r
+                                               this.constraintW = attrs[ XUI_Attr_Support.right.No ] !== null;\r
                                                break;\r
-                                       case X.UI.Attr.Support.right.No :\r
-                                               this.constraintW = attrs[ X.UI.Attr.Support.left.No ] !== null;\r
+                                       case XUI_Attr_Support.right.No :\r
+                                               this.constraintW = attrs[ XUI_Attr_Support.left.No ] !== null;\r
                                                break;\r
-                                       case X.UI.Attr.Support.top.No :\r
-                                               this.constraintH = attrs[ X.UI.Attr.Support.bottom.No ] !== null;\r
+                                       case XUI_Attr_Support.top.No :\r
+                                               this.constraintH = attrs[ XUI_Attr_Support.bottom.No ] !== null;\r
                                                break;\r
-                                       case X.UI.Attr.Support.bottom.No :\r
-                                               this.constraintH = attrs[ X.UI.Attr.Support.top.No ] !== null;\r
+                                       case XUI_Attr_Support.bottom.No :\r
+                                               this.constraintH = attrs[ XUI_Attr_Support.top.No ] !== null;\r
                                                break;\r
-                                       case X.UI.Attr.Support.width.No :\r
-                                               this.autoWidth    = v === X.UI.Attr.AUTO;\r
-                                               this.percentWidth = X.Type.isString( v );\r
+                                       case XUI_Attr_Support.width.No :\r
+                                               this.autoWidth    = v === XUI_Attr_AUTO;\r
+                                               this.percentWidth = X_Type_isString( v );\r
                                                break;\r
-                                       case X.UI.Attr.Support.height.No :\r
-                                               this.autoHeight    = v === X.UI.Attr.AUTO;\r
-                                               this.percentHeight = X.Type.isString( v );\r
+                                       case XUI_Attr_Support.height.No :\r
+                                               this.autoHeight    = v === XUI_Attr_AUTO;\r
+                                               this.percentHeight = X_Type_isString( v );\r
                                                break;\r
                                };\r
                                \r
@@ -260,93 +282,21 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                        attrs[ propID ] = v;\r
                                };\r
                                \r
-                               if( name && user === X.UI.Attr.USER.XNODE && this.xnode ){\r
-                                       this.xnode.css( X.UI.Attr.Rename[ name ] || name, this._createCssText( name ) );\r
-                                       //console.log( ( X.UI.Attr.Rename[ name ] || name ) + ' ' + this._createCssText( name ) + ' ' + propID + ' ' + attrs[ propID ] );\r
-                               } else\r
-                               if( this.dirty < dirty ) this.dirty = dirty;                                                    \r
-                       };\r
-               },\r
-\r
-               _createCssText : function( name ){\r
-                       var attrs      = this.attrObject || this.attrClass.prototype || X.UI.AttrClass,\r
-                               def        = this.supportAttrs[ name ],\r
-                               no         = def.No,\r
-                               v          = attrs[ def.No ],\r
-                               type       = def[ 3 ],\r
-                               list       = def[ 4 ],\r
-                               flag       = !!( type & X.UI.Attr.Type.BOOLEAN ),\r
-                               combi      = !!( type & X.UI.Attr.Type.COMBI   ),\r
-                               quartet    = !!( type & X.UI.Attr.Type.QUARTET );\r
-\r
-                       if( quartet ){\r
-                               if( attrs[ no + 1 ] === attrs[ no + 3 ] ){\r
-                                       if( v === attrs[ no + 2 ] ){\r
-                                               if( v === attrs[ no + 1 ] ){\r
-                                                       return this._createCssValue( v, type, list );\r
-                                               };\r
-                                               return [\r
-                                                       this._createCssValue( v, type, list ),\r
-                                                       this._createCssValue( attrs[ no + 1 ], type, list )\r
-                                               ].join( ' ' );\r
-                                       };\r
-                                       return [\r
-                                               this._createCssValue( v, type, list ),\r
-                                               this._createCssValue( attrs[ no + 1 ], type, list ),\r
-                                               this._createCssValue( attrs[ no + 2 ], type, list )\r
-                                       ].join( ' ' );\r
-                               };\r
-                               return [\r
-                                       this._createCssValue( v, type, list ),\r
-                                       this._createCssValue( attrs[ no + 1 ], type, list ),\r
-                                       this._createCssValue( attrs[ no + 2 ], type, list ),\r
-                                       this._createCssValue( attrs[ no + 3 ], type, list )\r
-                               ].join( ' ' );\r
-                       } else\r
-                       if( combi ){\r
-                               return [\r
-                                       this._createCssValue( v, type, list ),\r
-                                       this._createCssValue( attrs[ no + 1 ], type, list )\r
-                               ].join( ' ' );\r
-                       } else\r
-                       if( flag ){\r
-                               return v ? list : 'normal'; // \r
-                       };\r
-                       return this._createCssValue( v, type, list );\r
-               },\r
-\r
-               _createCssValue : function( v, type, list ){\r
-                       var length     = !!( type & X.UI.Attr.Type.LENGTH        ),\r
-                               minusLen   = !!( type & X.UI.Attr.Type.MINUS_LENGTH  ),\r
-                               percent    = !!( type & X.UI.Attr.Type.PERCENT       ),\r
-                               minusPct   = !!( type & X.UI.Attr.Type.MINUS_PERCENT ),\r
-                               numerical  = !!( type & X.UI.Attr.Type.NUMERICAL     ),\r
-                               auto       = !!( type & X.UI.Attr.Type.AUTO          ),\r
-                               color      = !!( type & X.UI.Attr.Type.COLOR         ),\r
-                               url        = !!( type & X.UI.Attr.Type.URL           ),\r
-                               fontName   = !!( type & X.UI.Attr.Type.FONT_NAME     );\r
-                       \r
-                       if( X.Type.isNumber( v ) ){\r
-                               if( auto && v === X.UI.Attr.AUTO ) return 'auto';\r
-                               if( length || minusLen ) return v + 'em';\r
-                               if( numerical ) return v;\r
-                               if( list && list[ v ] ) return list[ v ];\r
-                               if( color ){\r
-                                       if( v < 0x100000 ){\r
-                                               v = '00000' + v.toString( 16 );\r
-                                               return '#' + v.substr( v.length - 6 );\r
-                                       };\r
-                                       return '#' + v.toString( 16 );\r
+                               if( name && user === XUI_Attr_USER.UINODE ){\r
+                                       this[ name ] = v;\r
                                };\r
-                       };\r
-                       if( X.Type.isString( v ) ){\r
-                               if( percent || minusPct || url || fontName ) return v;\r
+                               \r
+                               if( name && user === XUI_Attr_USER.XNODE && this.xnode ){\r
+                                       this.xnode[ 'css' ]( XUI_Attr_Rename[ name ] || name, XUI_AbstractUINode_createCssText( this, name ) );\r
+                                       //console.log( ( XUI_Attr_Rename[ name ] || name ) + ' ' + XUI_AbstractUINode_createCssText( this, name ) + ' ' + propID + ' ' + attrs[ propID ] );\r
+                               } else\r
+                               if( this.dirty < dirty ) this.dirty = dirty;\r
                        };\r
                },\r
 \r
                getAttr : function( name ){\r
-                       var attrs   = this.attrObject || this.attrClass.prototype || X.UI.AttrClass,\r
-                               support = this.supportAttrs[ name ],\r
+                       var attrs   = this.attrObject || this.attrClass.prototype || XUI_AttrClass,\r
+                               support = this.usableAttrs[ name ],\r
                 v, type, list;\r
                        if( !support ) return;\r
                        \r
@@ -357,19 +307,19 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                        \r
                        type = support[ 3 ];\r
                        // Unit\r
-                       if( type & X.UI.Attr.Type.QUARTET ){\r
+                       if( type & XUI_Attr_Type.QUARTET ){\r
                                return [ this.getAttr( name + 'Top' ), this.getAttr( name + 'Right' ), this.getAttr( name + 'Bottom' ), this.getAttr( name + 'Left' ) ];\r
                        };\r
-                       if( type & X.UI.Attr.Type.COMBI   ) return [ v, data[ ++propID ] ];\r
+                       if( type & XUI_Attr_Type.COMBI   ) return [ v, data[ ++propID ] ];\r
                        \r
                        v    = attrs[ support.No ];             \r
-                       if( type & X.UI.Attr.Type.AUTO && v === X.UI.Attr.AUTO ) return 'auto'; \r
+                       if( type & XUI_Attr_Type.AUTO && v === XUI_Attr_AUTO ) return 'auto'; \r
                        \r
                        list = support[ 4 ];\r
                        if( list ) return list[ v ];\r
                        \r
-                       if( type & X.UI.Attr.Type.COLOR && X.Type.isNumber( v ) ) return v;\r
-                       if( !( type & X.UI.Attr.Type.NUMERICAL ) && X.Type.isNumber( v ) ) return v + 'em';\r
+                       if( type & XUI_Attr_Type.COLOR && X_Type_isNumber( v ) ) return v;\r
+                       if( !( type & XUI_Attr_Type.NUMERICAL ) && X_Type_isNumber( v ) ) return v + 'em';\r
                        return v;\r
                },\r
                \r
@@ -386,7 +336,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                case 2:\r
                                        \r
                                case 1:\r
-                                       this.xnode.destroy();\r
+                                       this.xnode[ 'kill' ]();\r
                                \r
                                        delete this.root;\r
                                        delete this.rootData;\r
@@ -403,36 +353,44 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                calculate : function( isNeedsDetection, x, y, allowedW, allowedH ){\r
                        this.preMesure( allowedW, allowedH );\r
                        \r
-                       if( this.boxWidth === X.UI.Attr.AUTO || this.boxHeight === X.UI.Attr.AUTO ){\r
+                       this.noWidth  = this.boxWidth === XUI_Attr_AUTO;\r
+                       this.noHeight = this.boxHeight === XUI_Attr_AUTO;\r
+                       \r
+                       if( this.noWidth || this.noHeight ){\r
                                this.mesure();\r
                                this.postMesure();\r
                        };\r
                        \r
-                       !isNeedsDetection && this.updateLayout( x, y );\r
+                       if( !isNeedsDetection ){\r
+                               this.boxX += x;\r
+                               this.boxY += y;                 \r
+                       };\r
                },\r
                \r
-               /**\r
+               /*\r
                 * X_Node_BoxModel の情報を引きながら top,left,width,height,padding,border の設定\r
                 */\r
-               updateLayout : function( x, y ){\r
-                       this.boxX = x;\r
-                       this.boxY = y;\r
+               updateLayout : function(){\r
+                       var x = this.boxX + ( this.parentData ? this.parentData.paddingL : 0 ),\r
+                               y = this.boxY + ( this.parentData ? this.parentData.paddingT : 0 ),\r
+                               w = X_UA[ 'IE5x' ] ? this.boxWidth  : this.contentWidth, // IE6 の互換モードも\r
+                               h = X_UA[ 'IE5x' ] ? this.boxHeight : this.contentHeight;\r
+\r
                        this.xnode\r
-                               .css( 'left',        x ? x + 'em' : 0 )\r
-                               .css( 'top',         y ? y + 'em' : 0 )\r
-                               .css( 'width',       this.contentWidth  ? X.UI._AbstractUINode.ceil( this.contentWidth  )  + 'em' : 0 )\r
-                               .css( 'height',      this.contentHeight ? X.UI._AbstractUINode.ceil( this.contentHeight ) + 'em' : 0 )\r
-                               .css( 'padding',     this._createCssText( 'padding' ) )\r
-                               .css( 'borderWidth', this._createCssText( 'borderWidth' ) );\r
+                               [ 'css' ]( 'left',        x ? x + 'em' : 0 ) // 親の padding 分ずらす\r
+                               [ 'css' ]( 'top',         y ? y + 'em' : 0 ) // 親の padding 分ずらす\r
+                               [ 'css' ]( 'width',       this.noWidth  ? 'auto' : w ? w + 'em' : 0 )\r
+                               [ 'css' ]( 'height',      this.noHeight ? 'auto' : h ? h + 'em' : 0 )\r
+                               [ 'css' ]( 'padding',     XUI_AbstractUINode_createCssText( this, 'padding' ) ) // TODO 不要? その分 w, h に足す\r
+                               [ 'css' ]( 'borderWidth', XUI_AbstractUINode_createCssText( this, 'borderWidth' ) );\r
                },\r
 \r
                /*\r
                 * 親の サイズを元に自身のサイズを計算していく\r
                 */\r
                preMesure : function( allowedW, allowedH ){\r
-                       var attrs = this.attrObject || this.attrClass.prototype || X.UI.AttrClass,\r
-                               calc  = X.UI._AbstractUINode.calcValue,\r
-                               box   = attrs[ X.UI.Attr.Support.sizing.No ],\r
+                       var attrs = this.attrObject || this.attrClass.prototype || XUI_AttrClass,\r
+                               box   = attrs[ XUI_Attr_Support.sizing.No ],\r
                                min, max,\r
                                boxL, boxT, boxR, boxB,\r
                                contentW, contentH, boxMinus,\r
@@ -443,10 +401,10 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                        // 自身が constraintW の場合 親が AUTO ではない\r
                        // 自身が constraintW でない場合自身が  AUTO はなくかつ親 が AUTO の場合 or 自身は % でない\r
                        \r
-                       paddingR = calc( attrs[ X.UI.Attr.Support.padding.No + 1 ], allowedW );\r
-                       paddingL = calc( attrs[ X.UI.Attr.Support.padding.No + 3 ], allowedW );\r
-                       borderR  = calc( attrs[ X.UI.Attr.Support.borderWidth.No + 1 ], allowedW );\r
-                       borderL  = calc( attrs[ X.UI.Attr.Support.borderWidth.No + 3 ], allowedW );\r
+                       paddingR = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.padding.No + 1 ], allowedW );\r
+                       paddingL = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.padding.No + 3 ], allowedW );\r
+                       borderR  = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.borderWidth.No + 1 ], allowedW );\r
+                       borderL  = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.borderWidth.No + 3 ], allowedW );\r
                        boxMinus = 0;\r
                        switch( box ){\r
                                case 3 : // border-box\r
@@ -457,37 +415,36 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                        };\r
                        this.contentL = borderL + paddingL;\r
                        this.contentR = borderR + paddingR;\r
+                       this.paddingL = paddingL;\r
+                       this.borderL  = borderL;\r
                        \r
-                       if( this.constraintW ? allowedW !== X.UI.Attr.AUTO : !this.autoWidth && ( allowedW !== X.UI.Attr.AUTO || !this.percentWidth ) ){\r
+                       if( this.constraintW ? allowedW !== XUI_Attr_AUTO : !this.autoWidth && ( allowedW !== XUI_Attr_AUTO || !this.percentWidth ) ){\r
                                if( this.constraintW ){ // 制約レイアウト\r
-                                       contentW = allowedW - ( boxL = calc( attrs[ X.UI.Attr.Support.left.No ], allowedW ) ) - ( boxR = calc( attrs[ X.UI.Attr.Support.right.No ], allowedW ) );\r
+                                       contentW = allowedW - ( boxL = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.left.No ], allowedW ) ) - ( boxR = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.right.No ], allowedW ) );\r
                                } else {\r
-                                       contentW = X.UI._AbstractUINode.finalValue( attrs[ X.UI.Attr.Support.width.No ], attrs[ X.UI.Attr.Support.minWidth.No ], attrs[ X.UI.Attr.Support.maxWidth.No ], allowedW );                                    \r
+                                       contentW = XUI_AbstractUINode_calcFinalValue( attrs[ XUI_Attr_Support.width.No ], attrs[ XUI_Attr_Support.minWidth.No ], attrs[ XUI_Attr_Support.maxWidth.No ], allowedW );                                     \r
                                };\r
-                               this.contentWidth = contentW + boxMinus;\r
-                               this.scrollWidth  = this.contentWidth + this.contentL + this.contentR;\r
-                               this.boxWidth     = contentW - boxMinus + this.contentL + this.contentR;\r
+                               this.contentWidth      = contentW + boxMinus;\r
+                               this.boxWidth          = this.contentWidth + this.contentL + this.contentR;\r
                                this.boxSizingOffsetLR = boxMinus;\r
-                               delete this.minContentWidth;\r
-                               delete this.maxContentWidth;\r
-                               delete this.minBoxWidth;\r
-                               delete this.maxBoxWidth;\r
+                               delete this.contentWidthMin;\r
+                               delete this.contentWidthMax;\r
+                               delete this.boxWidthMin;\r
+                               delete this.boxWidthMax;\r
                        } else {        \r
-                               this.minContentWidth = calc( attrs[ X.UI.Attr.Support.minWidth.No ], allowedW ) + boxMinus;\r
-                               this.maxContentWidth = calc( attrs[ X.UI.Attr.Support.maxWidth.No ], allowedW ) + boxMinus;\r
-                               this.scrollWidth     = this.contentWidth + this.contentL + this.contentR;\r
-                               this.minBoxWidth     = this.minContentWidth - boxMinus + this.contentL + this.contentR;\r
-                               this.maxBoxWidth     = this.maxContentWidth - boxMinus + this.contentL + this.contentR;\r
-                               //delete this.contentWidth;\r
-                               //delete this.scrollWidth;\r
-                               //delete this.boxWidth;\r
-                               //delete this.boxSizingOffsetLR;\r
-                       };\r
-                       \r
-                       paddingT  = calc( attrs[ X.UI.Attr.Support.padding.No + 0 ], allowedH );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
-                       paddingB  = calc( attrs[ X.UI.Attr.Support.padding.No + 2 ], allowedH );\r
-                       borderT   = calc( attrs[ X.UI.Attr.Support.borderWidth.No  + 0 ], allowedH );\r
-                       borderB   = calc( attrs[ X.UI.Attr.Support.borderWidth.No  + 2 ], allowedH );\r
+                               this.contentWidthMin   = XUI_AbstractUINode_ceil( XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.minWidth.No ], allowedW ) + boxMinus );\r
+                               this.contentWidthMax   = XUI_AbstractUINode_ceil( XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.maxWidth.No ], allowedW ) + boxMinus );\r
+                               this.boxWidthMin       = this.contentWidthMin + this.contentL + this.contentR;\r
+                               this.boxWidthMax       = this.contentWidthMax + this.contentL + this.contentR;\r
+                               this.contentWidth      = this.contentWidthMin;\r
+                               this.boxWidth          = this.boxWidthMin;\r
+                               this.boxSizingOffsetLR = boxMinus;\r
+                       };\r
+                       \r
+                       paddingT  = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.padding.No + 0 ], allowedH );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
+                       paddingB  = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.padding.No + 2 ], allowedH );\r
+                       borderT   = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.borderWidth.No  + 0 ], allowedH );\r
+                       borderB   = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.borderWidth.No  + 2 ], allowedH );\r
                        boxMinus = 0;\r
                        switch( box ){\r
                                case 3 : // border-box\r
@@ -498,69 +455,64 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                        };\r
                        this.contentT = borderT + paddingT;\r
                        this.contentB = borderB + paddingB;\r
+                       this.paddingT = paddingT;\r
+                       this.borderT  = borderT;\r
                        \r
                        // Height\r
-                       if( this.constraintH ? allowedH !== X.UI.Attr.AUTO : !this.autoHeight && ( allowedH !== X.UI.Attr.AUTO || !this.percentHeight ) ){\r
+                       if( this.constraintH ? allowedH !== XUI_Attr_AUTO : !this.autoHeight && ( allowedH !== XUI_Attr_AUTO || !this.percentHeight ) ){\r
                                if( this.constraintH ){ // 制約レイアウト\r
-                                       contentH = allowedH - ( boxT = calc( attrs[ X.UI.Attr.Support.top.No ], allowedH ) ) - ( boxB = calc( attrs[ X.UI.Attr.Support.bottom.No ], allowedH ) );\r
+                                       contentH = allowedH - ( boxT = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.top.No ], allowedH ) ) - ( boxB = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.bottom.No ], allowedH ) );\r
                                } else {\r
-                                       contentH = X.UI._AbstractUINode.finalValue( attrs[ X.UI.Attr.Support.height.No ], attrs[ X.UI.Attr.Support.minHeight.No ], attrs[ X.UI.Attr.Support.maxHeight.No ], allowedH );\r
+                                       contentH = XUI_AbstractUINode_calcFinalValue( attrs[ XUI_Attr_Support.height.No ], attrs[ XUI_Attr_Support.minHeight.No ], attrs[ XUI_Attr_Support.maxHeight.No ], allowedH );\r
                                };                      \r
-                               this.contentHeight = contentH + boxMinus;\r
-                               this.scrollHeight  = this.contentHeight + this.contentT + this.contentB;\r
-                               this.boxHeight     = contentH - boxMinus + this.contentT + this.contentB; // padding-box の場合 border だけ足される\r
+                               this.contentHeight     = contentH + boxMinus;\r
+                               this.boxHeight         = this.contentHeight + this.contentT + this.contentB; // padding-box の場合 border だけ足される\r
                                this.boxSizingOffsetTB = boxMinus;\r
-                               delete this.minContentHeight;\r
-                               delete this.maxContentHeight;\r
-                               delete this.minBoxHeight;\r
-                               delete this.maxBoxHeight;\r
+                               delete this.contentHeightMin;\r
+                               delete this.contentHeightMax;\r
+                               delete this.boxHeightMin;\r
+                               delete this.boxHeightMax;\r
                        } else {\r
-                               this.minContentHeight = calc( attrs[ X.UI.Attr.Support.minHeight.No ], allowedH ) + boxMinus;\r
-                               this.maxContentHeight = calc( attrs[ X.UI.Attr.Support.maxHeight.No ], allowedH ) + boxMinus;                           \r
-                               this.minBoxHeight = this.minContentHeight - boxMinus + this.contentT + this.contentB;\r
-                               this.maxBoxHeight = this.maxContentHeight - boxMinus + this.contentT + this.contentB;\r
-               \r
-                               //delete this.contentHeight;\r
-                               //delete this.scrollHeight;\r
-                               //delete this.boxHeight;\r
-                               //delete this.boxSizingOffsetTB;\r
+                               this.contentHeightMin  = XUI_AbstractUINode_ceil( XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.minHeight.No ], allowedH ) + boxMinus );\r
+                               this.contentHeightMax  = XUI_AbstractUINode_ceil( XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.maxHeight.No ], allowedH ) + boxMinus );                                \r
+                               this.boxHeightMin      = this.contentHeightMin + this.contentT + this.contentB;\r
+                               this.boxHeightMax      = this.contentHeightMax + this.contentT + this.contentB;\r
+                               this.contentHeight     = this.contentHeightMin;\r
+                               this.boxHeight         = this.boxHeightMin;\r
+                               this.boxSizingOffsetTB = boxMinus;\r
                        };\r
                        \r
+                       // x\r
                        if( this.parentData && this.parentData.layout.overrideAttrsForChild.left ){\r
-                               if( this.constraintW ){\r
-                                       this.boxX = ( boxL || boxL === 0 ) ? boxL : calc( attrs[ X.UI.Attr.Support.left.No ], allowedW );\r
-                               } else\r
-                               if( attrs[ X.UI.Attr.Support.right.No ] === null ){\r
-                                       this.boxX = ( boxL || boxL === 0 ) ? boxL : calc( attrs[ X.UI.Attr.Support.left.No ], allowedW );\r
+                               if( this.constraintW || attrs[ XUI_Attr_Support.right.No ] === null ){\r
+                                       this.boxX = ( boxL || boxL === 0 ) ? boxL : XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.left.No ], allowedW );\r
                                } else {\r
-                                       this.boxX = alllowW - this.boxWidth - ( ( boxR || boxR === 0 ) ? boxR : calc( attrs[ X.UI.Attr.Support.right.No ], allowedW ) );\r
+                                       this.boxX = allowedW - this.boxWidth - ( ( boxR || boxR === 0 ) ? boxR : XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.right.No ], allowedW ) );\r
                                };\r
                        } else {\r
                                delete this.boxX;\r
                        };\r
                        \r
+                       // y\r
                        if( this.parentData && this.parentData.layout.overrideAttrsForChild.top ){\r
-                               if( this.constraintH ){\r
-                                       this.boxY = ( boxT || boxT === 0 ) ? boxT : calc( attrs[ X.UI.Attr.Support.top.No ], allowedH );\r
-                               } else\r
-                               if( attrs[ X.UI.Attr.Support.bottom.No ] === null ){\r
-                                       this.boxY = ( boxT || boxT === 0 ) ? boxT : calc( attrs[ X.UI.Attr.Support.top.No ], allowedH );\r
+                               if( this.constraintH || attrs[ XUI_Attr_Support.bottom.No ] === null ){\r
+                                       this.boxY = ( boxT || boxT === 0 ) ? boxT : XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.top.No ], allowedH );\r
                                } else {\r
-                                       this.boxY = allowedH - this.boxHeight - ( ( boxB || boxB === 0 ) ? boxB : calc( attrs[ X.UI.Attr.Support.bottom.No ], allowedH ) );\r
+                                       this.boxY = allowedH - this.boxHeight - ( ( boxB || boxB === 0 ) ? boxB : XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.bottom.No ], allowedH ) );\r
                                };\r
                        } else {\r
                                delete this.boxY;\r
                        };\r
                },\r
                \r
-               /**\r
-                * 描画・計測を行って、contentSize, scrollSize の決定\r
+               /*\r
+                * 描画・計測を行って、contentSize の決定\r
                 */\r
                mesure : function(){\r
                        var dirty = this.dirty,\r
-                               w, h, xnode;\r
+                               w, _w, h, xnode;\r
                        \r
-                       if( dirty === X.UI.Dirty.CLEAN ){\r
+                       if( dirty === XUI_Dirty.CLEAN ){\r
                                if( this.percentWidth || this.percentHeight ){\r
                                        \r
                                };\r
@@ -568,14 +520,14 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                        \r
                        switch( dirty ){\r
                                \r
-                               case X.UI.Dirty.CONTENT : // コンテンツが変更された\r
-                               case X.UI.Dirty.FONT    : // フォントサイズが変更された\r
-                                       delete this.lastContentWidth;\r
-                                       delete this.lastContentHeight;\r
+                               case XUI_Dirty.CONTENT : // コンテンツが変更された\r
+                               case XUI_Dirty.FONT    : // フォントサイズが変更された\r
+                                       delete this.contentWidthLast;\r
+                                       delete this.contentHeightLast;\r
                                        \r
-                               case X.UI.Dirty.LAYOUT : // レイアウトの再計算が必要\r
+                               case XUI_Dirty.LAYOUT : // レイアウトの再計算が必要\r
                                \r
-                               default : // TODO レイアウト崩れに対処 パフォーマンス悪い!\r
+                               default : // TODO レイアウト指定が不正な場合 bgcolor を変更、これ以下のレイアウトの中止\r
                                \r
                                        w     = this.contentWidth;\r
                                        h     = this.contentHeight;\r
@@ -599,75 +551,77 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                         *     コンテンツの高さの再取得が必要\r
                                         *     必要でない\r
                                         */\r
-                                       if( xnode._xnodes && xnode._xnodes.length ){\r
-                                               if( w === X.UI.Attr.AUTO ){\r
-                                                       w = this.contentWidth = xnode.css( 'width', 'auto' ).width() / X_Node_CSS_getCharSize( xnode );\r
-                                                       \r
-                                                       this.scrollWidth = w + this.contentL + this.contentR;\r
-                                                       if( this.maxContentWidth < w - this.boxSizingOffsetLR ) this.contentWidth = this.maxContentWidth + this.boxSizingOffsetLR;\r
-                                                       if( w - this.boxSizingOffsetLR < this.minContentWidth ) this.contentWidth = this.minContentWidth + this.boxSizingOffsetLR;\r
-                                                       this.lastContentWidth = this.contentWidth;\r
+                                       if( xnode[ '_xnodes' ] && xnode[ '_xnodes' ].length ){\r
+                                               if( w === XUI_Attr_AUTO ){\r
                                                        \r
-                                                       w !== this.contentWidth && xnode.css( 'width', X.UI._AbstractUINode.ceil( this.contentWidth ) + 'em' );\r
-                                                       \r
-                                                       if( h === X.UI.Attr.AUTO ){\r
-                                                               this.contentHeight = h = xnode.css( 'height', 'auto' ).scrollHeight() / X_Node_CSS_getCharSize( xnode ); // scrollHeight() ??\r
-                                                               this.scrollHeight  = h + this.contentT + this.contentB;\r
-                                                               if( this.maxContentHeight < h - this.boxSizingOffsetTB ) this.contentHeight = this.maxContentHeight + this.boxSizingOffsetTB;\r
-                                                               if( h - this.boxSizingOffsetTB < this.minContentHeight ) this.contentHeight = this.minContentHeight + this.boxSizingOffsetTB;\r
-                                                       } else {\r
-                                                               this.scrollHeight = h + this.contentT + this.contentB;\r
+                                                       w = _w = XUI_AbstractUINode_ceil( xnode[ 'css' ]( 'width', 'auto' )[ 'clientWidth' ]() / X_Node_CSS_getCharSize( xnode ) );\r
+\r
+                                                       if( this.contentWidthMax < w - this.boxSizingOffsetLR ){\r
+                                                               this.noWidth = false;\r
+                                                               w = this.contentWidthMax + this.boxSizingOffsetLR;\r
                                                        };\r
-                                                       \r
-                                                       this.lastContentHeight = h;\r
+                                                       if( w - this.boxSizingOffsetLR < this.contentWidthMin ){\r
+                                                               this.noWidth = false;\r
+                                                               w = this.contentWidthMin + this.boxSizingOffsetLR;\r
+                                                       };\r
+\r
+                                                       if( h === XUI_Attr_AUTO ){\r
+                                                               w !== _w && xnode[ 'css' ]( 'width', w + 'em' );\r
+                                                               h = XUI_AbstractUINode_ceil( xnode[ 'css' ]( 'height', 'auto' )[ 'scrollHeight' ]() / X_Node_CSS_getCharSize( xnode ) );\r
+                                                               w !== _w && xnode[ 'css' ]( 'width', 'auto' );\r
+                                                       };\r
+\r
+                                                       this.contentWidthLast = this.contentWidth = w;\r
+\r
                                                } else\r
-                                               if( h === X.UI.Attr.AUTO ){\r
-                                                       if( w !== this.lastContentWidth ){\r
-                                                               xnode.css( 'width', X.UI._AbstractUINode.ceil( w ) + 'em' );\r
+                                               if( h === XUI_Attr_AUTO ){\r
+                                                       if( w !== this.contentWidthLast ){\r
+                                                               xnode[ 'css' ]( 'width', w + 'em' );                                                            \r
+                                                               this.contentWidthLast = w;\r
                                                                \r
-                                                               this.lastContentWidth  = w;\r
-                                                               this.contentHeight = h = xnode.css( 'height', 'auto' ).scrollHeight() / X_Node_CSS_getCharSize( xnode );\r
-                                                               this.scrollWidth       = w + this.contentL + this.contentR;\r
-                                                               this.scrollHeight      = h + this.contentT + this.contentB;\r
-                                                               if( this.maxContentHeight < h - this.boxSizingOffsetTB ) this.contentHeight = this.maxContentHeight + this.boxSizingOffsetTB;\r
-                                                               if( h - this.boxSizingOffsetTB < this.minContentHeight ) this.contentHeight = this.minContentHeight + this.boxSizingOffsetTB;                                                           \r
+                                                               // ie8 clientHeight, ff scrollHeight & clientHeight\r
+                                                               h = XUI_AbstractUINode_ceil( xnode[ 'css' ]( 'height', 'auto' )[ 'scrollHeight' ]() / X_Node_CSS_getCharSize( xnode ) );\r
                                                        } else {\r
-                                                               this.contentHeight = this.lastContentHeight = h =\r
-                                                                       this.lastContentHeight === -1 ? xnode.css( 'height', 'auto' ).scrollHeight() / X_Node_CSS_getCharSize( xnode ) : this.lastContentHeight;\r
-                                                               this.scrollWidth   = w + this.contentL + this.contentR;\r
-                                                               this.scrollHeight  = h + this.contentT + this.contentB;\r
+                                                               h = this.contentHeightLast === -1 ?\r
+                                                                               XUI_AbstractUINode_ceil( xnode[ 'css' ]( 'height', 'auto' )[ 'scrollHeight' ]() / X_Node_CSS_getCharSize( xnode ) ) :\r
+                                                                               this.contentHeightLast;\r
                                                        };\r
                                                } else\r
-                                               if( dirty !== X.UI.Dirty.LAYOUT ){\r
-                                                       this.contentWidth  = this.lastContentWidth  = w; //xnode.width();\r
-                                                       this.contentHeight = this.lastContentHeight = xnode.css( 'height', 'auto' ).scrollHeight() / X_Node_CSS_getCharSize( xnode );\r
-                                                       this.scrollWidth   = this.contentWidth  + this.contentL + this.contentR;\r
-                                                       this.scrollHeight  = this.contentHeight + this.contentT + this.contentB;\r
-                                               } else {\r
-                                                       this.scrollWidth  = w + this.contentL + this.contentR;\r
-                                                       this.scrollHeight = h + this.contentT + this.contentB;\r
-                                               };              \r
+                                               if( dirty !== XUI_Dirty.LAYOUT ){\r
+                                                       this.contentWidth  = this.contentWidthLast  = w;\r
+                                                       h = XUI_AbstractUINode_ceil( xnode[ 'css' ]( 'height', 'auto' )[ 'scrollHeight' ]() / X_Node_CSS_getCharSize( xnode ) );\r
+                                               };\r
+                                               \r
+                                               if( this.contentHeightMax < h - this.boxSizingOffsetTB ){\r
+                                                       this.noHeight = false;\r
+                                                       h = this.contentHeightMax + this.boxSizingOffsetTB;\r
+                                               };\r
+                                               if( h - this.boxSizingOffsetTB < this.contentHeightMin ){\r
+                                                       this.noHeight = false;\r
+                                                       h = this.contentHeightMin + this.boxSizingOffsetTB;\r
+                                               };\r
+                                               \r
+                                               this.contentHeight = this.contentHeightLast = h;\r
+                                               \r
                                        } else {\r
                                                // コンテンツを持たないため基本のサイズは0\r
-                                               if( w === X.UI.Attr.AUTO ) this.contentWidth  = w = 0 < this.minContentWidth  ? this.minContentWidth  : 0;\r
-                                               if( h === X.UI.Attr.AUTO ) this.contentHeight = h = 0 < this.minContentHeight ? this.minContentHeight : 0;\r
-                                               this.scrollWidth  = w + this.contentL + this.contentR;\r
-                                               this.scrollHeight = h + this.contentT + this.contentB;\r
+                                               if( w === XUI_Attr_AUTO ) this.contentWidth  = w = 0 < this.contentWidthMin  ? this.contentWidthMin  : 0;\r
+                                               if( h === XUI_Attr_AUTO ) this.contentHeight = h = 0 < this.contentHeightMin ? this.contentHeightMin : 0;\r
+                                               this.noWidth = this.noHeight = false;\r
                                        };\r
                                        \r
                                        delete this.dirty;\r
                                        break;                  \r
-                               //case X.UI.Dirty.PAINT : // 再描画のみ必要\r
+                               //case XUI_Dirty.PAINT : // 再描画のみ必要\r
                                //      break;\r
                        };\r
                },\r
-               /**\r
+               /*\r
                 * 自身の contentWidth, contentHeight を元に AUTO な width, height を確定していく\r
                 */\r
                postMesure : function(){\r
-                       var     attrs = this.attrObject || this.attrClass.prototype || X.UI.AttrClass,\r
-                               calc  = X.UI._AbstractUINode.calcValue,\r
-                               box   = attrs[ X.UI.Attr.Support.sizing.No ],\r
+                       var     attrs = this.attrObject || this.attrClass.prototype || XUI_AttrClass,\r
+                               box   = attrs[ XUI_Attr_Support.sizing.No ],\r
                                contentW, contentH,\r
                                contentPlus,\r
                                paddingT, paddingR, paddingB, paddingL,\r
@@ -675,25 +629,25 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                min, max;\r
                                \r
                        // Width\r
-                       if( this.boxWidth === X.UI.Attr.AUTO ){\r
+                       if( this.boxWidth === XUI_Attr_AUTO ){\r
                                contentW = this.contentWidth;\r
-                               paddingR = calc( attrs[ X.UI.Attr.Support.padding.No + 1 ], contentW );                                 \r
-                               paddingL = calc( attrs[ X.UI.Attr.Support.padding.No + 3 ], contentW );                                 \r
-                               borderR  = calc( attrs[ X.UI.Attr.Support.borderWidth.No + 1 ], contentW );\r
-                               borderL  = calc( attrs[ X.UI.Attr.Support.borderWidth.No + 3 ], contentW );\r
+                               paddingR = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.padding.No + 1 ], contentW );                                  \r
+                               paddingL = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.padding.No + 3 ], contentW );                                  \r
+                               borderR  = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.borderWidth.No + 1 ], contentW );\r
+                               borderL  = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.borderWidth.No + 3 ], contentW );\r
                                contentPlus = 0;\r
                                switch( box ){\r
-                                       case 3 : // border-box\r
-                                                contentPlus  = borderR + borderL;\r
+                                       case 1 : // content-box\r
+                                                contentPlus  = paddingR + paddingL;\r
                                        case 2 : // padding-box\r
-                                                contentPlus += paddingR + paddingL;\r
-                                       // case 1 : // content-box\r
+                                                contentPlus += borderR + borderL;\r
+                                       // case 3 : // border-box\r
                                };\r
                                \r
                                if( !this.constraintW ){\r
                                        contentW += contentPlus;\r
-                                       min = calc( attrs[ X.UI.Attr.Support.minWidth.No ], contentW );\r
-                                       max = calc( attrs[ X.UI.Attr.Support.maxWidth.No ], contentW );\r
+                                       min = this.boxWidthMin = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.minWidth.No ], contentW );\r
+                                       max = this.boxWidthMax = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.maxWidth.No ], contentW );\r
                                        if( contentW < min && contentPlus < min ){\r
                                                this.contentWidth = min - contentPlus;\r
                                        } else\r
@@ -703,27 +657,29 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                };\r
                                this.contentL = borderL + paddingL;\r
                                this.contentR = borderR + paddingR;\r
+                               this.paddingL = paddingL;\r
+                               this.borderL  = borderL;\r
                                this.boxWidth = this.contentWidth + this.contentL + this.contentR;\r
                        };\r
                        // Height\r
-                       if( this.boxHeight === X.UI.Attr.AUTO ){\r
+                       if( this.boxHeight === XUI_Attr_AUTO ){\r
                                contentH    = this.contentHeight;\r
-                               paddingT    = calc( attrs[ X.UI.Attr.Support.padding.No + 0 ], contentH );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
-                               paddingB    = calc( attrs[ X.UI.Attr.Support.padding.No + 2 ], contentH );\r
-                               borderT     = calc( attrs[ X.UI.Attr.Support.borderWidth.No  + 0 ], contentH );\r
-                               borderB     = calc( attrs[ X.UI.Attr.Support.borderWidth.No  + 2 ], contentH );\r
+                               paddingT    = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.padding.No + 0 ], contentH );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
+                               paddingB    = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.padding.No + 2 ], contentH );\r
+                               borderT     = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.borderWidth.No  + 0 ], contentH );\r
+                               borderB     = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.borderWidth.No  + 2 ], contentH );\r
                                contentPlus = 0;\r
                                switch( box ){\r
-                                       case 3 : // border-box\r
-                                                contentPlus  = borderT + borderB;\r
+                                       case 1 : // content-box\r
+                                                contentPlus  = paddingT + paddingB;\r
                                        case 2 : // padding-box\r
-                                                contentPlus += paddingT + paddingB;\r
-                                       // case 1 : // content-box\r
+                                                contentPlus += borderT + borderB;\r
+                                       // case 3 : // border-box\r
                                };\r
                                if( !this.constraintH ){\r
                                        contentH += contentPlus;\r
-                                       min = calc( attrs[ X.UI.Attr.Support.minHeight.No ], contentH );\r
-                                       max = calc( attrs[ X.UI.Attr.Support.maxHeight.No ], contentH );\r
+                                       min = this.boxHeightMin = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.minHeight.No ], contentH );\r
+                                       max = this.boxHeightMax = XUI_AbstractUINode_calcValue( attrs[ XUI_Attr_Support.maxHeight.No ], contentH );\r
                                        if( contentH < min && contentPlus < min ){\r
                                                this.contentHeight = min - contentPlus;\r
                                        } else\r
@@ -733,10 +689,13 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                };\r
                                this.contentT  = borderT + paddingT;\r
                                this.contentB  = borderB + paddingB;\r
+                               this.paddingT  = paddingT;\r
+                               this.borderT   = borderT;\r
                                this.boxHeight = this.contentHeight + this.contentT + this.contentB;\r
                        };\r
                },\r
 \r
+               // TODO fontsize が変わることもある\r
                capcher : function( x, y ){\r
                        if( this.pointerDisabled ) return false;\r
                        \r
@@ -750,20 +709,23 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                        };\r
                },\r
                \r
-               \r
+               /*\r
+                * context を明示しない場合、User が context になる!\r
+                */\r
                listen : function( type, arg1, arg2, arg3 ){\r
                        var root, events, counter, f;\r
-                       if( X.UI.Event._START_POINTER <= type && type <= X.UI.Event._END_POINTER ){\r
+                       \r
+                       if( XUI_Event._START_POINTER <= type && type <= XUI_Event._END_POINTER ){\r
                                if( this.phase < 3 ){\r
                                        if( !( events = this.reserveEvents ) ) this.reserveEvents = events = [];\r
                                        events[ events.length ] = [ type, arg1, arg2, arg3 ];\r
                                        return this;\r
                                };\r
-                               if( X.UI.Event._START_XUI_EVENT < type && type < X.UI.Event._END_XUI_EVENT ){\r
+                               if( XUI_Event._START_XUI_EVENT < type && type < XUI_Event._END_XUI_EVENT ){\r
                                        if( !this.gesture ){\r
-                                               this.gesture = new X.UI.Gesture( this.rootData, this, type );\r
+                                               this.gesture = new Hammer( this.rootData, this, type );\r
                                        } else {\r
-                                               this.gesture.listen( type );\r
+                                               this.gesture[ 'listen' ]( type );\r
                                        };\r
                                } else {\r
                                        //console.log( type );\r
@@ -773,22 +735,23 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                                ++counter[ type ];\r
                                        } else {\r
                                                counter[ type ] = 1;                            \r
-                                               root.xnodeInteractiveLayer.listen( X.UI.Event.IdToName[ type ], X.UI._eventRellay );\r
+                                               root.xnodeInteractiveLayer[ 'listen' ]( XUI_Event.IdToName[ type ], X_UI_eventRellay );\r
                                        };\r
                                };\r
                        };\r
-                       f = X_Callback_classifyCallbackArgs( arg1, arg2, arg3 );\r
-                       if( !f.k ){\r
+                       \r
+                       arg1 && arg1.cbKind ? ( f = arg1 ) : ( f = X_Closure_classifyCallbackArgs( arg1, arg2, arg3 ) );\r
+                       if( !f.cbKind ){\r
                                return X_EventDispatcher_listen.call( this, type, this.User, f );\r
                        } else\r
-                       if( f.k === X_Callback_FUNC_ONLY ){\r
-                               return X_EventDispatcher_listen.call( this, type, this.User, f.f, f.s );\r
+                       if( f.cbKind === X_CLOSURE_FUNC_ONLY ){\r
+                               return X_EventDispatcher_listen.call( this, type, this.User, f.func, f.supplement );\r
                        };\r
                        return X_EventDispatcher_listen.apply( this, arguments );\r
                },\r
                unlisten : function( type, arg1, arg2, arg3 ){\r
                        var root, events, i, ev, counter, f;\r
-                       if( X.UI.Event._START_POINTER <= type && type <= X.UI.Event._END_POINTER ){\r
+                       if( XUI_Event._START_POINTER <= type && type <= XUI_Event._END_POINTER ){\r
                                if( this.phase < 3 ){\r
                                        if( !( events = this.reserveEvents ) ) return this;\r
                                        for( i = events.length; i; ){\r
@@ -801,82 +764,169 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
                                        return this;\r
                                };\r
 \r
-                               if( X.UI.Event._START_XUI_EVENT < type && type < X.UI.Event._END_XUI_EVENT ){\r
-                                       this.gesture && this.gesture.unlisten( type );\r
+                               if( XUI_Event._START_XUI_EVENT < type && type < XUI_Event._END_XUI_EVENT ){\r
+                                       this.gesture && this.gesture[ 'unlisten' ]( type );\r
                                } else {\r
                                        root    = this.rootData;\r
                                        counter = root.eventCounter;\r
                                        if( !counter[ type ] ) return this;\r
                                        --counter[ type ];\r
                                        if( counter[ type ] === 0 ){\r
-                                               root.xnodeInteractiveLayer.unlisten( X.UI.Event.IdToName[ type ], X.UI._eventRellay );\r
+                                               root.xnodeInteractiveLayer[ 'unlisten' ]( XUI_Event.IdToName[ type ], X_UI_eventRellay );\r
                                                delete counter[ type ];\r
                                        };\r
                                };\r
                        };\r
-                       f = X_Callback_classifyCallbackArgs( arg1, arg2, arg3 );\r
-                       if( !f.k ){\r
-                               return X.EventDispatcher.prototype.unlisten.apply( this, [ type, this.User, f ] );\r
+                       arg1 && arg1.cbKind ? ( f = arg1 ) : ( f = X_Closure_classifyCallbackArgs( arg1, arg2, arg3 ) );\r
+                       if( !f.cbKind ){\r
+                               return X_EventDispatcher_unlisten.apply( this, [ type, this.User, f ] );\r
                        } else\r
-                       if( f.k === X_Callback_FUNC_ONLY ){\r
-                               return X.EventDispatcher.prototype.unlisten.apply( this, [ type, this.User, f.f, f.s ] );\r
+                       if( f.cbKind === X_CLOSURE_FUNC_ONLY ){\r
+                               return X_EventDispatcher_unlisten.apply( this, [ type, this.User, f.func, f.supplement ] );\r
                        };\r
-                       return X.EventDispatcher.prototype.unlisten.apply( this, arguments );\r
+                       return X_EventDispatcher_unlisten.apply( this, arguments );\r
                },\r
                \r
                dispatch : function( e ){\r
-                       //console.log( e.type + ' ' + ( this._listeners && this._listeners[ e.type ] ) );\r
-                       var xve  = X.UI.Event,\r
+                       //console.log( e.type + ' ' + ( this[ '_listeners' ] && this[ '_listeners' ][ e.type ] ) );\r
+                       var xve  = XUI_Event,\r
                                ret  = X_EventDispatcher_dispatch.call( this, e ),\r
                                type = e.type || e;\r
                        \r
                        // TODO captureEvent PointerEvent\r
-                       if( ret & X.Callback.MONOPOLY && !this.hitChildData && ( xve._POINTER_MOVE === type || xve._MOUSE_MOVE === type || xve.FILE_DRAG === type ) ){\r
+                       if( ret & X_CALLBACK_CAPTURE_POINTER && !this.hitChildData && XUI_Event._POINTER_MOVE === type ){\r
                                this.rootData.monopolyNodeData = this;\r
                                return ret;\r
                        };\r
                        this.rootData.monopolyNodeData = null;\r
-                       if( xve._START_BUBLEUP < type && this.parentData && !( ret & X.Callback.STOP_PROPAGATION ) && !( ret & X.Callback.STOP_NOW ) ) return this.parentData.dispatch( e );\r
+                       if( xve._START_BUBLEUP < type && this.parentData && !( ret & X_CALLBACK_STOP_PROPAGATION ) && !( ret & X_CALLBACK_STOP_NOW ) ) return this.parentData[ 'dispatch' ]( e );\r
                        return ret;\r
+               },\r
+               \r
+               setItemData : function( itemData ){\r
+                       if( this.itemData === itemData ) return;\r
+\r
+                       this.itemData = itemData;\r
+\r
+                       this[ 'dispatch' ]( { type : XUI_Event.ITEMDATA_CHANGED, itemData : itemData } );\r
+                       // itemData && itemData.listen( X_Event_CHANGED )\r
+                       // dataFeild dataFormatter dataValidator\r
+                       \r
+                       // itemData.listen( X_Event_CHANGED ) -> this[ 'dispatch' ]( UI_Event.ITEMDATA_UPDATED );\r
                }\r
                \r
        }\r
 );\r
 \r
-X.UI._AbstractUINode.calcValue = function( styleValue, srcValue ){\r
+function XUI_AbstractUINode_createCssText( that, name ){\r
+       var attrs      = that.attrObject || that.attrClass.prototype || XUI_AttrClass,\r
+               def        = that.usableAttrs[ name ],\r
+               no         = def.No,\r
+               v          = attrs[ def.No ],\r
+               type       = def[ 3 ],\r
+               list       = def[ 4 ],\r
+               flag       = !!( type & XUI_Attr_Type.BOOLEAN ),\r
+               combi      = !!( type & XUI_Attr_Type.COMBI   ),\r
+               quartet    = !!( type & XUI_Attr_Type.QUARTET );\r
+\r
+       if( quartet ){\r
+               if( attrs[ no + 1 ] === attrs[ no + 3 ] ){\r
+                       if( v === attrs[ no + 2 ] ){\r
+                               if( v === attrs[ no + 1 ] ){\r
+                                       return XUI_AbstractUINode_createCssValue( v, type, list );\r
+                               };\r
+                               return [\r
+                                       XUI_AbstractUINode_createCssValue( v, type, list ),\r
+                                       XUI_AbstractUINode_createCssValue( attrs[ no + 1 ], type, list )\r
+                               ].join( ' ' );\r
+                       };\r
+                       return [\r
+                               XUI_AbstractUINode_createCssValue( v, type, list ),\r
+                               XUI_AbstractUINode_createCssValue( attrs[ no + 1 ], type, list ),\r
+                               XUI_AbstractUINode_createCssValue( attrs[ no + 2 ], type, list )\r
+                       ].join( ' ' );\r
+               };\r
+               return [\r
+                       XUI_AbstractUINode_createCssValue( v, type, list ),\r
+                       XUI_AbstractUINode_createCssValue( attrs[ no + 1 ], type, list ),\r
+                       XUI_AbstractUINode_createCssValue( attrs[ no + 2 ], type, list ),\r
+                       XUI_AbstractUINode_createCssValue( attrs[ no + 3 ], type, list )\r
+               ].join( ' ' );\r
+       } else\r
+       if( combi ){\r
+               return [\r
+                       XUI_AbstractUINode_createCssValue( v, type, list ),\r
+                       XUI_AbstractUINode_createCssValue( attrs[ no + 1 ], type, list )\r
+               ].join( ' ' );\r
+       } else\r
+       if( flag ){\r
+               return v ? list : 'normal'; // \r
+       };\r
+       return XUI_AbstractUINode_createCssValue( v, type, list );\r
+};\r
+\r
+function XUI_AbstractUINode_createCssValue( v, type, list ){\r
+       var length     = !!( type & XUI_Attr_Type.LENGTH        ),\r
+               minusLen   = !!( type & XUI_Attr_Type.MINUS_LENGTH  ),\r
+               percent    = !!( type & XUI_Attr_Type.PERCENT       ),\r
+               minusPct   = !!( type & XUI_Attr_Type.MINUS_PERCENT ),\r
+               numerical  = !!( type & XUI_Attr_Type.NUMERICAL     ),\r
+               auto       = !!( type & XUI_Attr_Type.AUTO          ),\r
+               color      = !!( type & XUI_Attr_Type.COLOR         ),\r
+               url        = !!( type & XUI_Attr_Type.URL           ),\r
+               fontName   = !!( type & XUI_Attr_Type.FONT_NAME     );\r
+       \r
+       if( X_Type_isNumber( v ) ){\r
+               if( auto && v === XUI_Attr_AUTO ) return 'auto';\r
+               if( length || minusLen ) return v + 'em';\r
+               if( numerical ) return v;\r
+               if( list && list[ v ] ) return list[ v ];\r
+               if( color ){\r
+                       if( v < 0x100000 ){\r
+                               v = '00000' + v.toString( 16 );\r
+                               return '#' + v.substr( v.length - 6 );\r
+                       };\r
+                       return '#' + v.toString( 16 );\r
+               };\r
+       };\r
+       if( X_Type_isString( v ) ){\r
+               if( percent || minusPct || url || fontName ) return v;\r
+       };\r
+};\r
+\r
+function XUI_AbstractUINode_calcValue( styleValue, srcValue ){\r
        /*\r
         * String の場合は必ず %\r
         */     \r
-       if( X.Type.isString( styleValue ) ){\r
+       if( X_Type_isString( styleValue ) ){\r
                return srcValue * parseFloat( styleValue ) / 100;\r
        };\r
-       if( !X.Type.isNumber( styleValue ) ) return 0;\r
+       if( !X_Type_isNumber( styleValue ) ) return 0;\r
        return styleValue;\r
 };\r
 \r
-X.UI._AbstractUINode.finalValue = function( styleValue, styleMin, styleMax, srcValue ){\r
-       var calc = X.UI._AbstractUINode.calcValue,\r
-               v    = calc( styleValue, srcValue ),\r
-               min  = calc( styleMin, srcValue ),\r
-               max  = calc( styleMax, srcValue );\r
+function XUI_AbstractUINode_calcFinalValue( styleValue, styleMin, styleMax, srcValue ){\r
+       var v    = XUI_AbstractUINode_calcValue( styleValue, srcValue ),\r
+               min  = XUI_AbstractUINode_calcValue( styleMin, srcValue ),\r
+               max  = XUI_AbstractUINode_calcValue( styleMax, srcValue );\r
        return v <= min ? min : max <= v ? max : v;\r
 };\r
-X.UI._AbstractUINode.ceil = function( v ){\r
+function XUI_AbstractUINode_ceil( v ){\r
        if( 0 <= v ){\r
                return ( v * 10 + 0.999 | 0 ) / 10;\r
        };\r
        return ( -v * 10 + 0.999 | 0 ) / -10;\r
 };\r
 \r
-X.UI.AbstractUINode = X.Class.create(\r
+X.UI.AbstractUINode = X_Class_create(\r
        'AbstractUINode',\r
-       X.Class.ABSTRACT | X.Class.SUPER_ACCESS,\r
+       X_Class.ABSTRACT,\r
        {\r
                parent : function(){\r
-                       return X_Class_getPrivate( this ).parent;\r
+                       return X_Pair_get( this ).parent;\r
                },\r
                root : function(){\r
-                       return X_Class_getPrivate( this ).root;\r
+                       return X_Pair_get( this ).root;\r
                },\r
                \r
                /*\r
@@ -884,9 +934,9 @@ X.UI.AbstractUINode = X.Class.create(
                 * サポートされていない場合は無視される.親のレイアウトによって変わる\r
                 */\r
                attr : function( nameOrObject, valueOrUnit ){\r
-                       var p = X_Class_getPrivate( this ),\r
+                       var p = X_Pair_get( this ),\r
                                layout, k, def, attrs, v;\r
-                       if( nameOrObject && X.Type.isObject( nameOrObject ) ){\r
+                       if( nameOrObject && X_Type_isObject( nameOrObject ) ){\r
                                // setter\r
                                layout = p.parentData && p.parentData.layout.overrideAttrsForChild; // root には parent がない\r
                                for( k in nameOrObject ){\r
@@ -895,24 +945,24 @@ X.UI.AbstractUINode = X.Class.create(
                                        if( layout && !layout[ k ] ){\r
                                                continue;\r
                                        };\r
-                                       if( def = p.supportAttrs[ k ] ){\r
+                                       if( def = p.usableAttrs[ k ] ){\r
                                                p.setAttr( k, def, nameOrObject[ k ] );\r
                                        };\r
                                };\r
                        } else\r
-                       if( X.Type.isString( nameOrObject ) ){\r
+                       if( X_Type_isString( nameOrObject ) && ( def = p.usableAttrs[ nameOrObject ] ) ){\r
                                if( valueOrUnit !== undefined ){\r
                                        if( 'em,%'.indexOf( valueOrUnit ) === -1 ){\r
                                                // setter\r
-                                               p.setAttr( nameOrObject, valueOrUnit );\r
+                                               p.setAttr( nameOrObject, def, valueOrUnit );\r
                                        } else {\r
                                                // getter with unit\r
                                                return p.getAttrWithUnit( nameOrObject, valueOrUnit );\r
                                        };\r
                                };\r
                                // getter\r
-                               if( attrs = ( p.attrObject || p.attrClass.prototype || X.UI.AttrClass ) ){\r
-                                       def = p.supportAttrs[ nameOrObject ];\r
+                               if( attrs = ( p.attrObject || p.attrClass.prototype || XUI_AttrClass ) ){\r
+                                       def = p.usableAttrs[ nameOrObject ];\r
                                        return def && attrs[ def.No ];\r
                                };\r
                                return v;\r
@@ -921,32 +971,32 @@ X.UI.AbstractUINode = X.Class.create(
                },\r
                \r
                listen : function( type, arg1, arg2, arg3 ){\r
-                       X_Class_getPrivate( this ).listen( type, arg1, arg2, arg3 );\r
+                       X_Pair_get( this )[ 'listen' ]( type, arg1, arg2, arg3 );\r
                        return this;\r
                },\r
                listenOnce : function( type, arg1, arg2, arg3 ){\r
-                       X_Class_getPrivate( this ).listenOnce( type, arg1, arg2, arg3 );\r
+                       X_Pair_get( this )[ 'listenOnce' ]( type, arg1, arg2, arg3 );\r
                        return this;\r
                },\r
                listening : function( type, arg1, arg2, arg3 ){\r
-                       return X_Class_getPrivate( this ).listening( type, arg1, arg2, arg3 );\r
+                       return X_Pair_get( this )[ 'listening' ]( type, arg1, arg2, arg3 );\r
                },\r
                unlisten : function( type, arg1, arg2, arg3 ){\r
-                       X_Class_getPrivate( this ).unlisten( type, arg1, arg2, arg3 );\r
+                       X_Pair_get( this )[ 'unlisten' ]( type, arg1, arg2, arg3 );\r
                        return this;\r
                },\r
                dispatch : function( e ){\r
-                       return X_Class_getPrivate( this ).dispatch( e );\r
+                       return X_Pair_get( this )[ 'dispatch' ]( e );\r
                },\r
                        \r
-               getNextNode : function(){\r
+               nextNode : function(){\r
                        \r
                },\r
-               getPrevNode : function(){\r
+               prevNode : function(){\r
                        \r
                },\r
                nodeIndex : function( v ){\r
-                       var data = X_Class_getPrivate( this );\r
+                       var data = X_Pair_get( this );\r
                        if( typeof v === 'number' ){\r
                                // data.nodeIndex( v );\r
                                return this;\r
@@ -958,44 +1008,108 @@ X.UI.AbstractUINode = X.Class.create(
                },\r
                getX : function(){\r
                        // dirty の場合、rootData.calculate\r
-                       return X_Class_getPrivate( this ).boxX;\r
+                       return X_Pair_get( this ).boxX;\r
                },\r
                getY : function(){\r
                        // dirty の場合、rootData.calculate\r
-                       return X_Class_getPrivate( this ).boxY;\r
+                       return X_Pair_get( this ).boxY;\r
                },\r
                getAbsoluteX : function(){\r
                        // dirty の場合、rootData.calculate\r
-                       return X_Class_getPrivate( this ).absoluteX;\r
+                       return X_Pair_get( this ).absoluteX;\r
                },\r
                getAbsoluteY: function(){\r
                        // dirty の場合、rootData.calculate\r
-                       return X_Class_getPrivate( this ).absoluteY;\r
+                       return X_Pair_get( this ).absoluteY;\r
                },\r
                getWidth : function(){\r
                        // dirty の場合、rootData.calculate\r
-                       return X_Class_getPrivate( this ).boxWidth;\r
+                       return X_Pair_get( this ).boxWidth;\r
                },\r
                getHeight : function(){\r
                        // dirty の場合、rootData.calculate\r
-                       return X_Class_getPrivate( this ).boxHeight;\r
-               },\r
-               scrollTo : function( x, y ){\r
-                       X_Class_getPrivate( this ).scrollTo( x, y );\r
-               },\r
-               getScrollX : function( v ){\r
-                       // dirty の場合、rootData.calculate\r
-                       return X_Class_getPrivate( this ).scrollX( v );\r
-               },\r
-               getScrollY : function( v ){\r
-                       // dirty の場合、rootData.calculate\r
-                       return X_Class_getPrivate( this ).scrollY( v );\r
-               },\r
-               disabled : function( v ){\r
-                       return X_Class_getPrivate( this ).disabled( v );\r
+                       return X_Pair_get( this ).boxHeight;\r
                },\r
-               cursor : function( v ){\r
-                       return X_Class_getPrivate( this ).cursor( v );\r
+               \r
+               /*\r
+                * Repeater に於いて、繰り返されるアイテムの元(itemRenderer)からの複製に使用\r
+                */\r
+               clone : function( opt_cloneListener ){\r
+                       var newNode,\r
+                               //newPair = X_Pair_get( newNode ),\r
+                               pair    = X_Pair_get( this ),\r
+                               attr, listeners, type, list, i, l, k;\r
+\r
+                       // attr もコピー\r
+                       if( pair.attrObject ){\r
+                               attr = {};\r
+                               for( k in pair.usableAttrs ){\r
+                                       def = pair.usableAttrs[ k ];\r
+                                       attr[ k ] = pair.attrObject[ def.No ];\r
+                               };\r
+                               newNode = this.constructor( attr );\r
+                       };\r
+\r
+                       // handleEvent 等の拡張されたオブジェクトもコピーする!\r
+                       for( k in this ){\r
+                               if( this[ k ] !== newNode[ k ] && !newNode[ k ] ) newNode[ k ] = this[ k ];\r
+                       };\r
+                       \r
+                       // User.UINODE な値は pair にコピーされているのでこれをコピー\r
+                       for( k in pair ){\r
+                               //pair[ k ] !== newPair[ k ] && !newPair[ k ] && console.log( k );\r
+                               //if( pair[ k ] !== newPair[ k ] && !newPair[ k ] && k !== 'attrObject' && k !== '_listeners' ){\r
+                                       //newPair[ k ] = pair[ k ];\r
+                                       //console.log( k );\r
+                               //};\r
+                       };\r
+                       \r
+\r
+                       \r
+                       // listener もコピーする!\r
+                       if( opt_cloneListener && ( listeners = pair[ '_listeners' ] ) ){\r
+                               for( type in listeners ){\r
+                                       list = listeners[ type ];\r
+                                       for( i = 0, l = list.length; i < l; ++i ){\r
+                                               f = list[ i ];\r
+                                               switch( f.cbKind ){\r
+                                                       case X_CLOSURE_THIS_FUNC :\r
+                                                               if( f.lock ){\r
+                                                                       X_EventDispatcher_systemListen( newNode, type, f.context === this ? newNode : f.context, f.func, f.supplement );\r
+                                                               } else {\r
+                                                                       newNode[ f.once ? 'listenOnce' : 'listen' ]( type, f.context === this ? newNode : f.context, f.func, f.supplement );\r
+                                                               };\r
+                                                               break;\r
+                                                       case X_CLOSURE_HANDLEEVENT :\r
+                                                               if( f.lock ){\r
+                                                                       X_EventDispatcher_systemListen( newNode, type, f.context === this ? newNode : f.context, f.supplement );\r
+                                                               } else {\r
+                                                                       newNode[ f.once ? 'listenOnce' : 'listen' ]( type, f.context === this ? newNode : f.context, f.supplement );\r
+                                                               };\r
+                                                               break;\r
+                                                       /*\r
+                                                       case X_CLOSURE_FUNC_ONLY :\r
+                                                               if( f.lock ){\r
+                                                                       X_EventDispatcher_systemListen( newNode, type, f.func, f.supplement );\r
+                                                               } else {\r
+                                                                       newNode[ f.once ? 'listenOnce' : 'listen' ]( type, f.func, f.supplement );\r
+                                                               };\r
+                                                               break;\r
+                                                       default :\r
+                                                               newNode[ 'listen' ]( type, f );\r
+                                                               break; */\r
+                                               };\r
+                                       };                              \r
+                               };\r
+                       } else\r
+                       if( opt_cloneListener && ( list = this.reserveEvents ) ){\r
+                               for( i = 0, l = list.length; i < l; ++i ){\r
+                                       f = list[ i ];\r
+                                       newNode[ f.once ? 'listenOnce' : 'listen' ]( f[ 0 ], newNode, f[ 1 ], f[ 2 ] );\r
+                               };      \r
+                       };\r
+                       \r
+                       return newNode;\r
                }\r
        }\r
 );\r