X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.6.x%2Fjs%2F20_ui%2F06_AbstractUINode.js;h=f649cd5aa03aed0c063ab7c5c74f3be5b1f22dc0;hb=eedd028ba64be2ea0828cf686f1d0ec3bb4010d5;hp=f3b9c1fbe8a31d2a3e82338c48bd637bc3428324;hpb=a4b6249d16b938ce6fd1c7691f144ff99729056f;p=pettanr%2FclientJs.git

diff --git a/0.6.x/js/20_ui/06_AbstractUINode.js b/0.6.x/js/20_ui/06_AbstractUINode.js
index f3b9c1f..f649cd5 100644
--- a/0.6.x/js/20_ui/06_AbstractUINode.js
+++ b/0.6.x/js/20_ui/06_AbstractUINode.js
@@ -1,6 +1,6 @@
-X.UI._AbstractUINode = X.EventDispatcher.inherits(
+X.UI._AbstractUINode = X_EventDispatcher[ 'inherits' ](
 	'X.UI._AbstractUINode',
-	X.Class.ABSTRACT | X.Class.PRIVATE_DATA,
+	X_Class.ABSTRACT | X_Class.PRIVATE_DATA,
 	{
 		phase             : 0,
 		dirty             : X.UI.Dirty.CLEAN,
@@ -17,7 +17,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 		attrObject        : null,
 		unverifiedAttrs   : null,
 		
-		role              : null,
+		role              : 1,
 		pointerDisabled   : false,
 		hoverClassName    : null,
 		hovering          : false,
@@ -30,8 +30,8 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 		
 		boxX              : 0,
 		boxY              : 0,
-		scrollWidth       : 0,
-		scrollHeight      : 0,		
+		scrollWidth       : 0, // remove?
+		scrollHeight      : 0, // remove?
 		boxWidth          : X.UI.Attr.AUTO,
 		minBoxWidth       : 0,
 		maxBoxWidth       : X.UI.Attr.AUTO,	
@@ -66,17 +66,17 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			this.rootData   = rootData;
 			this.parent     = parent;
 			this.parentData = parentData;
-			//this.xnode      = X.Node.create( 'div' );
+			//this.xnode      = X_Doc_create( 'div' );
 			this.phase      = 1;
 			
-			this.dispatch( X.UI.Event.INIT );
+			this[ 'dispatch' ]( X.UI.Event.INIT );
 		},
 		
 		addToParent : function( xnodeParent ){
-			xnodeParent && xnodeParent.append( this.xnode );
+			xnodeParent && xnodeParent[ 'append' ]( this.xnode );
 			
 			this.phase = 2;
-			this.dispatch( X.UI.Event.ADDED );
+			this[ 'dispatch' ]( X.UI.Event.ADDED );
 		},
 		
 		creationComplete : function(){
@@ -84,7 +84,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				l, i;
 			
 			this.phase = 3;
-			this.User.dispatch( X.UI.Event.CREATION_COMPLETE );
+			this.User[ 'dispatch' ]( X.UI.Event.CREATION_COMPLETE );
 			
 			// html 要素が親に追加されるまで控えていたイベントの登録
 			if( events && ( l = events.length ) ){
@@ -123,7 +123,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				quartet    = !!( type & X.UI.Attr.Type.QUARTET       ),
 				_v, i, l, nodes, root, roots;
 		
-			if( X.Type.isString( v ) ){
+			if( X_Type_isString( v ) ){
 				//v = v.toLowercase();
 				if( url || fontName ){
 					// good
@@ -133,6 +133,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				} else
 				if( list && ( _v = list[ v ] ) ){
 					// good
+					console.log( v + ' ' + _v );
 					v = _v;
 				} else
 				if( ( percent || minusPct ) && v.lastIndexOf( '%' ) !== -1 && isFinite( _v = parseFloat( v ) ) && v === _v + '%' ){
@@ -144,7 +145,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				if( v.indexOf( ' ' ) !== -1 ){
 					v = v.split( ' ' );
 				} else
-				if( color && X.Type.isNumber( _v = X.CSS.parseColor( v ) ) ){
+				if( color && X_Type_isNumber( _v = X_Node_CSS_objToIEFilterText( v ) ) ){
 					v = _v;
 				} else {
 					// bad
@@ -152,11 +153,11 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				};
 			};
 			
-			if( ( quartet || combi ) && !X.Type.isArray( v ) ){
+			if( ( quartet || combi ) && !X_Type_isArray( v ) ){
 				v = [ v ];
 			};
 			
-			if( X.Type.isNumber( v ) ){
+			if( X_Type_isNumber( v ) ){
 				if( 
 				    ( length    && ( 0 <= v ) ) ||
 				    ( minusLen  && ( v <= 0 ) ) ||
@@ -173,10 +174,10 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 					return;
 				};
 			} else
-			if( X.Type.isBoolean( v ) && !flag ){
+			if( X_Type_isBoolean( v ) && !flag ){
 				return;
 			} else
-			if( X.Type.isArray( v ) ){
+			if( X_Type_isArray( v ) ){
 				if( v.length <= 4 && quartet ){
 					type &= ~X.UI.Attr.Type.QUARTET;
 					switch( v.length ){
@@ -216,8 +217,8 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				};
 
 				if( !X.UI.attrClassProto && user === X.UI.Attr.USER.XNODE && this.xnode ){
-					this.xnode.css( X.UI.Attr.Rename[ name ] || name, this._createCssText( name ) );
-					//console.log( ( X.UI.Attr.Rename[ name ] || name ) + ' ' + this._createCssText( name ) + ' ' + propID + ' ' + attrs[ propID ] );
+					this.xnode[ 'css' ]( X.UI.Attr.Rename[ name ] || name, XUI_AbstractUINode_createCssText( this, name ) );
+					//console.log( ( X.UI.Attr.Rename[ name ] || name ) + ' ' + XUI_AbstractUINode_createCssText( this, name ) + ' ' + propID + ' ' + attrs[ propID ] );
 				};
 				return;
 			};
@@ -245,11 +246,11 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 						break;
 					case X.UI.Attr.Support.width.No :
 						this.autoWidth    = v === X.UI.Attr.AUTO;
-						this.percentWidth = X.Type.isString( v );
+						this.percentWidth = X_Type_isString( v );
 						break;
 					case X.UI.Attr.Support.height.No :
 						this.autoHeight    = v === X.UI.Attr.AUTO;
-						this.percentHeight = X.Type.isString( v );
+						this.percentHeight = X_Type_isString( v );
 						break;
 				};
 				
@@ -260,87 +261,15 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 					attrs[ propID ] = v;
 				};
 				
+				if( name && user === X.UI.Attr.USER.UINODE ){
+					this[ name ] = v;
+				};
+				
 				if( name && user === X.UI.Attr.USER.XNODE && this.xnode ){
-					this.xnode.css( X.UI.Attr.Rename[ name ] || name, this._createCssText( name ) );
-					//console.log( ( X.UI.Attr.Rename[ name ] || name ) + ' ' + this._createCssText( name ) + ' ' + propID + ' ' + attrs[ propID ] );
+					this.xnode[ 'css' ]( X.UI.Attr.Rename[ name ] || name, XUI_AbstractUINode_createCssText( this, name ) );
+					//console.log( ( X.UI.Attr.Rename[ name ] || name ) + ' ' + XUI_AbstractUINode_createCssText( this, name ) + ' ' + propID + ' ' + attrs[ propID ] );
 				} else
-				if( this.dirty < dirty ) this.dirty = dirty;							
-			};
-		},
-
-		_createCssText : function( name ){
-			var attrs      = this.attrObject || this.attrClass.prototype || X.UI.AttrClass,
-				def        = this.supportAttrs[ name ],
-				no         = def.No,
-				v          = attrs[ def.No ],
-				type       = def[ 3 ],
-				list       = def[ 4 ],
-				flag       = !!( type & X.UI.Attr.Type.BOOLEAN ),
-				combi      = !!( type & X.UI.Attr.Type.COMBI   ),
-				quartet    = !!( type & X.UI.Attr.Type.QUARTET );
-
-			if( quartet ){
-				if( attrs[ no + 1 ] === attrs[ no + 3 ] ){
-					if( v === attrs[ no + 2 ] ){
-						if( v === attrs[ no + 1 ] ){
-							return this._createCssValue( v, type, list );
-						};
-						return [
-							this._createCssValue( v, type, list ),
-							this._createCssValue( attrs[ no + 1 ], type, list )
-						].join( ' ' );
-					};
-					return [
-						this._createCssValue( v, type, list ),
-						this._createCssValue( attrs[ no + 1 ], type, list ),
-						this._createCssValue( attrs[ no + 2 ], type, list )
-					].join( ' ' );
-				};
-				return [
-					this._createCssValue( v, type, list ),
-					this._createCssValue( attrs[ no + 1 ], type, list ),
-					this._createCssValue( attrs[ no + 2 ], type, list ),
-					this._createCssValue( attrs[ no + 3 ], type, list )
-				].join( ' ' );
-			} else
-			if( combi ){
-				return [
-					this._createCssValue( v, type, list ),
-					this._createCssValue( attrs[ no + 1 ], type, list )
-				].join( ' ' );
-			} else
-			if( flag ){
-				return v ? list : 'normal'; // 
-			};
-			return this._createCssValue( v, type, list );
-		},
-
-		_createCssValue : function( v, type, list ){
-			var length     = !!( type & X.UI.Attr.Type.LENGTH        ),
-				minusLen   = !!( type & X.UI.Attr.Type.MINUS_LENGTH  ),
-				percent    = !!( type & X.UI.Attr.Type.PERCENT       ),
-				minusPct   = !!( type & X.UI.Attr.Type.MINUS_PERCENT ),
-				numerical  = !!( type & X.UI.Attr.Type.NUMERICAL     ),
-				auto       = !!( type & X.UI.Attr.Type.AUTO          ),
-				color      = !!( type & X.UI.Attr.Type.COLOR         ),
-				url        = !!( type & X.UI.Attr.Type.URL           ),
-				fontName   = !!( type & X.UI.Attr.Type.FONT_NAME     );
-			
-			if( X.Type.isNumber( v ) ){
-				if( auto && v === X.UI.Attr.AUTO ) return 'auto';
-				if( length || minusLen ) return v + 'em';
-				if( numerical ) return v;
-				if( list && list[ v ] ) return list[ v ];
-				if( color ){
-					if( v < 0x100000 ){
-						v = '00000' + v.toString( 16 );
-						return '#' + v.substr( v.length - 6 );
-					};
-					return '#' + v.toString( 16 );
-				};
-			};
-			if( X.Type.isString( v ) ){
-				if( percent || minusPct || url || fontName ) return v;
+				if( this.dirty < dirty ) this.dirty = dirty;
 			};
 		},
 
@@ -368,8 +297,8 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			list = support[ 4 ];
 			if( list ) return list[ v ];
 			
-			if( type & X.UI.Attr.Type.COLOR && X.Type.isNumber( v ) ) return v;
-			if( !( type & X.UI.Attr.Type.NUMERICAL ) && X.Type.isNumber( v ) ) return v + 'em';
+			if( type & X.UI.Attr.Type.COLOR && X_Type_isNumber( v ) ) return v;
+			if( !( type & X.UI.Attr.Type.NUMERICAL ) && X_Type_isNumber( v ) ) return v + 'em';
 			return v;
 		},
 		
@@ -386,7 +315,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				case 2:
 					
 				case 1:
-					this.xnode.destroy();
+					this.xnode[ 'kill' ]();
 				
 					delete this.root;
 					delete this.rootData;
@@ -418,12 +347,12 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			this.boxX = x;
 			this.boxY = y;
 			this.xnode
-				.css( 'left',        x ? x + 'em' : 0 )
-				.css( 'top',         y ? y + 'em' : 0 )
-				.css( 'width',       this.contentWidth  ? X.UI._AbstractUINode.ceil( this.contentWidth  )  + 'em' : 0 )
-				.css( 'height',      this.contentHeight ? X.UI._AbstractUINode.ceil( this.contentHeight ) + 'em' : 0 )
-				.css( 'padding',     this._createCssText( 'padding' ) )
-				.css( 'borderWidth', this._createCssText( 'borderWidth' ) );
+				[ 'css' ]( 'left',        x ? x + 'em' : 0 )
+				[ 'css' ]( 'top',         y ? y + 'em' : 0 )
+				[ 'css' ]( 'width',       this.contentWidth  ? XUI_AbstractUINode_ceil( this.contentWidth  ) + 'em' : 0 )
+				[ 'css' ]( 'height',      this.contentHeight ? XUI_AbstractUINode_ceil( this.contentHeight ) + 'em' : 0 )
+				[ 'css' ]( 'padding',     XUI_AbstractUINode_createCssText( this, 'padding' ) )
+				[ 'css' ]( 'borderWidth', XUI_AbstractUINode_createCssText( this, 'borderWidth' ) );
 		},
 
 		/*
@@ -431,7 +360,6 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 		 */
 		preMesure : function( allowedW, allowedH ){
 			var attrs = this.attrObject || this.attrClass.prototype || X.UI.AttrClass,
-				calc  = X.UI._AbstractUINode.calcValue,
 				box   = attrs[ X.UI.Attr.Support.sizing.No ],
 				min, max,
 				boxL, boxT, boxR, boxB,
@@ -443,10 +371,10 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			// 自身が constraintW の場合 親が AUTO ではない
 			// 自身が constraintW でない場合自身が  AUTO はなくかつ親 が AUTO の場合 or 自身は % でない
 			
-			paddingR = calc( attrs[ X.UI.Attr.Support.padding.No + 1 ], allowedW );
-			paddingL = calc( attrs[ X.UI.Attr.Support.padding.No + 3 ], allowedW );
-			borderR  = calc( attrs[ X.UI.Attr.Support.borderWidth.No + 1 ], allowedW );
-			borderL  = calc( attrs[ X.UI.Attr.Support.borderWidth.No + 3 ], allowedW );
+			paddingR = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.padding.No + 1 ], allowedW );
+			paddingL = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.padding.No + 3 ], allowedW );
+			borderR  = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.borderWidth.No + 1 ], allowedW );
+			borderL  = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.borderWidth.No + 3 ], allowedW );
 			boxMinus = 0;
 			switch( box ){
 				case 3 : // border-box
@@ -460,9 +388,9 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			
 			if( this.constraintW ? allowedW !== X.UI.Attr.AUTO : !this.autoWidth && ( allowedW !== X.UI.Attr.AUTO || !this.percentWidth ) ){
 				if( this.constraintW ){ // 制約レイアウト
-					contentW = allowedW - ( boxL = calc( attrs[ X.UI.Attr.Support.left.No ], allowedW ) ) - ( boxR = calc( attrs[ X.UI.Attr.Support.right.No ], allowedW ) );
+					contentW = allowedW - ( boxL = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.left.No ], allowedW ) ) - ( boxR = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.right.No ], allowedW ) );
 				} else {
-					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 );					
+					contentW = XUI_AbstractUINode_calcFinalValue( attrs[ X.UI.Attr.Support.width.No ], attrs[ X.UI.Attr.Support.minWidth.No ], attrs[ X.UI.Attr.Support.maxWidth.No ], allowedW );					
 				};
 				this.contentWidth = contentW + boxMinus;
 				this.scrollWidth  = this.contentWidth + this.contentL + this.contentR;
@@ -473,8 +401,8 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				delete this.minBoxWidth;
 				delete this.maxBoxWidth;
 			} else {	
-				this.minContentWidth = calc( attrs[ X.UI.Attr.Support.minWidth.No ], allowedW ) + boxMinus;
-				this.maxContentWidth = calc( attrs[ X.UI.Attr.Support.maxWidth.No ], allowedW ) + boxMinus;
+				this.minContentWidth = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.minWidth.No ], allowedW ) + boxMinus;
+				this.maxContentWidth = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.maxWidth.No ], allowedW ) + boxMinus;
 				this.scrollWidth     = this.contentWidth + this.contentL + this.contentR;
 				this.minBoxWidth     = this.minContentWidth - boxMinus + this.contentL + this.contentR;
 				this.maxBoxWidth     = this.maxContentWidth - boxMinus + this.contentL + this.contentR;
@@ -484,10 +412,10 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				//delete this.boxSizingOffsetLR;
 			};
 			
-			paddingT  = calc( attrs[ X.UI.Attr.Support.padding.No + 0 ], allowedH );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して
-			paddingB  = calc( attrs[ X.UI.Attr.Support.padding.No + 2 ], allowedH );
-			borderT   = calc( attrs[ X.UI.Attr.Support.borderWidth.No  + 0 ], allowedH );
-			borderB   = calc( attrs[ X.UI.Attr.Support.borderWidth.No  + 2 ], allowedH );
+			paddingT  = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.padding.No + 0 ], allowedH );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して
+			paddingB  = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.padding.No + 2 ], allowedH );
+			borderT   = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.borderWidth.No  + 0 ], allowedH );
+			borderB   = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.borderWidth.No  + 2 ], allowedH );
 			boxMinus = 0;
 			switch( box ){
 				case 3 : // border-box
@@ -502,9 +430,9 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			// Height
 			if( this.constraintH ? allowedH !== X.UI.Attr.AUTO : !this.autoHeight && ( allowedH !== X.UI.Attr.AUTO || !this.percentHeight ) ){
 				if( this.constraintH ){ // 制約レイアウト
-					contentH = allowedH - ( boxT = calc( attrs[ X.UI.Attr.Support.top.No ], allowedH ) ) - ( boxB = calc( attrs[ X.UI.Attr.Support.bottom.No ], allowedH ) );
+					contentH = allowedH - ( boxT = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.top.No ], allowedH ) ) - ( boxB = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.bottom.No ], allowedH ) );
 				} else {
-					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 );
+					contentH = XUI_AbstractUINode_calcFinalValue( attrs[ X.UI.Attr.Support.height.No ], attrs[ X.UI.Attr.Support.minHeight.No ], attrs[ X.UI.Attr.Support.maxHeight.No ], allowedH );
 				};			
 				this.contentHeight = contentH + boxMinus;
 				this.scrollHeight  = this.contentHeight + this.contentT + this.contentB;
@@ -515,8 +443,8 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				delete this.minBoxHeight;
 				delete this.maxBoxHeight;
 			} else {
-				this.minContentHeight = calc( attrs[ X.UI.Attr.Support.minHeight.No ], allowedH ) + boxMinus;
-				this.maxContentHeight = calc( attrs[ X.UI.Attr.Support.maxHeight.No ], allowedH ) + boxMinus;				
+				this.minContentHeight = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.minHeight.No ], allowedH ) + boxMinus;
+				this.maxContentHeight = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.maxHeight.No ], allowedH ) + boxMinus;				
 				this.minBoxHeight = this.minContentHeight - boxMinus + this.contentT + this.contentB;
 				this.maxBoxHeight = this.maxContentHeight - boxMinus + this.contentT + this.contentB;
 		
@@ -528,12 +456,12 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			
 			if( this.parentData && this.parentData.layout.overrideAttrsForChild.left ){
 				if( this.constraintW ){
-					this.boxX = ( boxL || boxL === 0 ) ? boxL : calc( attrs[ X.UI.Attr.Support.left.No ], allowedW );
+					this.boxX = ( boxL || boxL === 0 ) ? boxL : XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.left.No ], allowedW );
 				} else
 				if( attrs[ X.UI.Attr.Support.right.No ] === null ){
-					this.boxX = ( boxL || boxL === 0 ) ? boxL : calc( attrs[ X.UI.Attr.Support.left.No ], allowedW );
+					this.boxX = ( boxL || boxL === 0 ) ? boxL : XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.left.No ], allowedW );
 				} else {
-					this.boxX = alllowW - this.boxWidth - ( ( boxR || boxR === 0 ) ? boxR : calc( attrs[ X.UI.Attr.Support.right.No ], allowedW ) );
+					this.boxX = alllowW - this.boxWidth - ( ( boxR || boxR === 0 ) ? boxR : XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.right.No ], allowedW ) );
 				};
 			} else {
 				delete this.boxX;
@@ -541,12 +469,12 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			
 			if( this.parentData && this.parentData.layout.overrideAttrsForChild.top ){
 				if( this.constraintH ){
-					this.boxY = ( boxT || boxT === 0 ) ? boxT : calc( attrs[ X.UI.Attr.Support.top.No ], allowedH );
+					this.boxY = ( boxT || boxT === 0 ) ? boxT : XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.top.No ], allowedH );
 				} else
 				if( attrs[ X.UI.Attr.Support.bottom.No ] === null ){
-					this.boxY = ( boxT || boxT === 0 ) ? boxT : calc( attrs[ X.UI.Attr.Support.top.No ], allowedH );
+					this.boxY = ( boxT || boxT === 0 ) ? boxT : XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.top.No ], allowedH );
 				} else {
-					this.boxY = allowedH - this.boxHeight - ( ( boxB || boxB === 0 ) ? boxB : calc( attrs[ X.UI.Attr.Support.bottom.No ], allowedH ) );
+					this.boxY = allowedH - this.boxHeight - ( ( boxB || boxB === 0 ) ? boxB : XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.bottom.No ], allowedH ) );
 				};
 			} else {
 				delete this.boxY;
@@ -599,19 +527,19 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 					 *     コンテンツの高さの再取得が必要
 					 *     必要でない
 					 */
-					if( xnode._xnodes && xnode._xnodes.length ){
+					if( xnode[ '_xnodes' ] && xnode[ '_xnodes' ].length ){
 						if( w === X.UI.Attr.AUTO ){
-							w = this.contentWidth = xnode.css( 'width', 'auto' ).width() / X_Node_CSS_getCharSize( xnode );
+							w = this.contentWidth = xnode[ 'css' ]( 'width', 'auto' )[ 'width' ]() / X_Node_CSS_getCharSize( xnode );
 							
 							this.scrollWidth = w + this.contentL + this.contentR;
 							if( this.maxContentWidth < w - this.boxSizingOffsetLR ) this.contentWidth = this.maxContentWidth + this.boxSizingOffsetLR;
 							if( w - this.boxSizingOffsetLR < this.minContentWidth ) this.contentWidth = this.minContentWidth + this.boxSizingOffsetLR;
 							this.lastContentWidth = this.contentWidth;
 							
-							w !== this.contentWidth && xnode.css( 'width', X.UI._AbstractUINode.ceil( this.contentWidth ) + 'em' );
+							w !== this.contentWidth && xnode[ 'css' ]( 'width', XUI_AbstractUINode_ceil( this.contentWidth ) + 'em' );
 							
 							if( h === X.UI.Attr.AUTO ){
-								this.contentHeight = h = xnode.css( 'height', 'auto' ).scrollHeight() / X_Node_CSS_getCharSize( xnode ); // scrollHeight() ??
+								this.contentHeight = h = xnode[ 'css' ]( 'height', 'auto' )[ 'scrollHeight' ]() / X_Node_CSS_getCharSize( xnode ); // scrollHeight() ??
 								this.scrollHeight  = h + this.contentT + this.contentB;
 								if( this.maxContentHeight < h - this.boxSizingOffsetTB ) this.contentHeight = this.maxContentHeight + this.boxSizingOffsetTB;
 								if( h - this.boxSizingOffsetTB < this.minContentHeight ) this.contentHeight = this.minContentHeight + this.boxSizingOffsetTB;
@@ -623,24 +551,24 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 						} else
 						if( h === X.UI.Attr.AUTO ){
 							if( w !== this.lastContentWidth ){
-								xnode.css( 'width', X.UI._AbstractUINode.ceil( w ) + 'em' );
+								xnode[ 'css' ]( 'width', XUI_AbstractUINode_ceil( w ) + 'em' );
 								
 								this.lastContentWidth  = w;
-								this.contentHeight = h = xnode.css( 'height', 'auto' ).scrollHeight() / X_Node_CSS_getCharSize( xnode );
+								this.contentHeight = h = xnode[ 'css' ]( 'height', 'auto' )[ 'scrollHeight' ]() / X_Node_CSS_getCharSize( xnode );
 								this.scrollWidth       = w + this.contentL + this.contentR;
 								this.scrollHeight      = h + this.contentT + this.contentB;
 								if( this.maxContentHeight < h - this.boxSizingOffsetTB ) this.contentHeight = this.maxContentHeight + this.boxSizingOffsetTB;
 								if( h - this.boxSizingOffsetTB < this.minContentHeight ) this.contentHeight = this.minContentHeight + this.boxSizingOffsetTB;								
 							} else {
 								this.contentHeight = this.lastContentHeight = h =
-									this.lastContentHeight === -1 ? xnode.css( 'height', 'auto' ).scrollHeight() / X_Node_CSS_getCharSize( xnode ) : this.lastContentHeight;
+									this.lastContentHeight === -1 ? xnode[ 'css' ]( 'height', 'auto' )[ 'scrollHeight' ]() / X_Node_CSS_getCharSize( xnode ) : this.lastContentHeight;
 								this.scrollWidth   = w + this.contentL + this.contentR;
 								this.scrollHeight  = h + this.contentT + this.contentB;
 							};
 						} else
 						if( dirty !== X.UI.Dirty.LAYOUT ){
-							this.contentWidth  = this.lastContentWidth  = w; //xnode.width();
-							this.contentHeight = this.lastContentHeight = xnode.css( 'height', 'auto' ).scrollHeight() / X_Node_CSS_getCharSize( xnode );
+							this.contentWidth  = this.lastContentWidth  = w; //xnode[ 'width' ]();
+							this.contentHeight = this.lastContentHeight = xnode[ 'css' ]( 'height', 'auto' )[ 'scrollHeight' ]() / X_Node_CSS_getCharSize( xnode );
 							this.scrollWidth   = this.contentWidth  + this.contentL + this.contentR;
 							this.scrollHeight  = this.contentHeight + this.contentT + this.contentB;
 						} else {
@@ -666,7 +594,6 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 		 */
 		postMesure : function(){
 			var	attrs = this.attrObject || this.attrClass.prototype || X.UI.AttrClass,
-				calc  = X.UI._AbstractUINode.calcValue,
 				box   = attrs[ X.UI.Attr.Support.sizing.No ],
 				contentW, contentH,
 				contentPlus,
@@ -677,10 +604,10 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			// Width
 			if( this.boxWidth === X.UI.Attr.AUTO ){
 				contentW = this.contentWidth;
-				paddingR = calc( attrs[ X.UI.Attr.Support.padding.No + 1 ], contentW );					
-				paddingL = calc( attrs[ X.UI.Attr.Support.padding.No + 3 ], contentW );					
-				borderR  = calc( attrs[ X.UI.Attr.Support.borderWidth.No + 1 ], contentW );
-				borderL  = calc( attrs[ X.UI.Attr.Support.borderWidth.No + 3 ], contentW );
+				paddingR = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.padding.No + 1 ], contentW );					
+				paddingL = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.padding.No + 3 ], contentW );					
+				borderR  = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.borderWidth.No + 1 ], contentW );
+				borderL  = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.borderWidth.No + 3 ], contentW );
 				contentPlus = 0;
 				switch( box ){
 					case 3 : // border-box
@@ -692,8 +619,8 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				
 				if( !this.constraintW ){
 					contentW += contentPlus;
-					min = calc( attrs[ X.UI.Attr.Support.minWidth.No ], contentW );
-					max = calc( attrs[ X.UI.Attr.Support.maxWidth.No ], contentW );
+					min = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.minWidth.No ], contentW );
+					max = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.maxWidth.No ], contentW );
 					if( contentW < min && contentPlus < min ){
 						this.contentWidth = min - contentPlus;
 					} else
@@ -708,10 +635,10 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			// Height
 			if( this.boxHeight === X.UI.Attr.AUTO ){
 				contentH    = this.contentHeight;
-				paddingT    = calc( attrs[ X.UI.Attr.Support.padding.No + 0 ], contentH );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して
-				paddingB    = calc( attrs[ X.UI.Attr.Support.padding.No + 2 ], contentH );
-				borderT     = calc( attrs[ X.UI.Attr.Support.borderWidth.No  + 0 ], contentH );
-				borderB     = calc( attrs[ X.UI.Attr.Support.borderWidth.No  + 2 ], contentH );
+				paddingT    = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.padding.No + 0 ], contentH );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して
+				paddingB    = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.padding.No + 2 ], contentH );
+				borderT     = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.borderWidth.No  + 0 ], contentH );
+				borderB     = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.borderWidth.No  + 2 ], contentH );
 				contentPlus = 0;
 				switch( box ){
 					case 3 : // border-box
@@ -722,8 +649,8 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				};
 				if( !this.constraintH ){
 					contentH += contentPlus;
-					min = calc( attrs[ X.UI.Attr.Support.minHeight.No ], contentH );
-					max = calc( attrs[ X.UI.Attr.Support.maxHeight.No ], contentH );
+					min = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.minHeight.No ], contentH );
+					max = XUI_AbstractUINode_calcValue( attrs[ X.UI.Attr.Support.maxHeight.No ], contentH );
 					if( contentH < min && contentPlus < min ){
 						this.contentHeight = min - contentPlus;
 					} else
@@ -750,7 +677,9 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 			};
 		},
 		
-		
+		/*
+		 * context を明示しない場合、User が context になる！
+		 */
 		listen : function( type, arg1, arg2, arg3 ){
 			var root, events, counter, f;
 			if( X.UI.Event._START_POINTER <= type && type <= X.UI.Event._END_POINTER ){
@@ -763,7 +692,7 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 					if( !this.gesture ){
 						this.gesture = new X.UI.Gesture( this.rootData, this, type );
 					} else {
-						this.gesture.listen( type );
+						this.gesture[ 'listen' ]( type );
 					};
 				} else {
 					//console.log( type );
@@ -773,16 +702,16 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 						++counter[ type ];
 					} else {
 						counter[ type ] = 1;				
-						root.xnodeInteractiveLayer.listen( X.UI.Event.IdToName[ type ], X.UI._eventRellay );
+						root.xnodeInteractiveLayer[ 'listen' ]( X.UI.Event.IdToName[ type ], X_UI_eventRellay );
 					};
 				};
 			};
-			f = X_Callback_classifyCallbackArgs( arg1, arg2, arg3 );
-			if( !f.k ){
+			arg1 && arg1.kind ? ( f = arg1 ) : ( f = X_Callback_classifyCallbackArgs( arg1, arg2, arg3 ) );
+			if( !f.kind ){
 				return X_EventDispatcher_listen.call( this, type, this.User, f );
 			} else
-			if( f.k === X_Callback_FUNC_ONLY ){
-				return X_EventDispatcher_listen.call( this, type, this.User, f.f, f.s );
+			if( f.kind === X_Callback_FUNC_ONLY ){
+				return X_EventDispatcher_listen.call( this, type, this.User, f.func, f.supplement );
 			};
 			return X_EventDispatcher_listen.apply( this, arguments );
 		},
@@ -802,75 +731,150 @@ X.UI._AbstractUINode = X.EventDispatcher.inherits(
 				};
 
 				if( X.UI.Event._START_XUI_EVENT < type && type < X.UI.Event._END_XUI_EVENT ){
-					this.gesture && this.gesture.unlisten( type );
+					this.gesture && this.gesture[ 'unlisten' ]( type );
 				} else {
 					root    = this.rootData;
 					counter = root.eventCounter;
 					if( !counter[ type ] ) return this;
 					--counter[ type ];
 					if( counter[ type ] === 0 ){
-						root.xnodeInteractiveLayer.unlisten( X.UI.Event.IdToName[ type ], X.UI._eventRellay );
+						root.xnodeInteractiveLayer[ 'unlisten' ]( X.UI.Event.IdToName[ type ], X_UI_eventRellay );
 						delete counter[ type ];
 					};
 				};
 			};
-			f = X_Callback_classifyCallbackArgs( arg1, arg2, arg3 );
-			if( !f.k ){
-				return X.EventDispatcher.prototype.unlisten.apply( this, [ type, this.User, f ] );
+			arg1 && arg1.kind ? ( f = arg1 ) : ( f = X_Callback_classifyCallbackArgs( arg1, arg2, arg3 ) );
+			if( !f.kind ){
+				return X_EventDispatcher_unlisten.apply( this, [ type, this.User, f ] );
 			} else
-			if( f.k === X_Callback_FUNC_ONLY ){
-				return X.EventDispatcher.prototype.unlisten.apply( this, [ type, this.User, f.f, f.s ] );
+			if( f.kind === X_Callback_FUNC_ONLY ){
+				return X_EventDispatcher_unlisten.apply( this, [ type, this.User, f.func, f.supplement ] );
 			};
-			return X.EventDispatcher.prototype.unlisten.apply( this, arguments );
+			return X_EventDispatcher_unlisten.apply( this, arguments );
 		},
 		
 		dispatch : function( e ){
-			//console.log( e.type + ' ' + ( this._listeners && this._listeners[ e.type ] ) );
+			//console.log( e.type + ' ' + ( this[ '_listeners' ] && this[ '_listeners' ][ e.type ] ) );
 			var xve  = X.UI.Event,
 				ret  = X_EventDispatcher_dispatch.call( this, e ),
 				type = e.type || e;
 			
 			// TODO captureEvent PointerEvent
-			if( ret & X.Callback.MONOPOLY && !this.hitChildData && ( xve._POINTER_MOVE === type || xve._MOUSE_MOVE === type || xve.FILE_DRAG === type ) ){
+			if( ret & X_Callback_MONOPOLY && !this.hitChildData && ( xve._POINTER_MOVE === type || xve._MOUSE_MOVE === type || xve.FILE_DRAG === type ) ){
 				this.rootData.monopolyNodeData = this;
 				return ret;
 			};
 			this.rootData.monopolyNodeData = null;
-			if( xve._START_BUBLEUP < type && this.parentData && !( ret & X.Callback.STOP_PROPAGATION ) && !( ret & X.Callback.STOP_NOW ) ) return this.parentData.dispatch( e );
+			if( xve._START_BUBLEUP < type && this.parentData && !( ret & X_Callback_STOP_PROPAGATION ) && !( ret & X_Callback_STOP_NOW ) ) return this.parentData[ 'dispatch' ]( e );
 			return ret;
 		}
 		
 	}
 );
 
-X.UI._AbstractUINode.calcValue = function( styleValue, srcValue ){
+function XUI_AbstractUINode_createCssText( that, name ){
+	var attrs      = that.attrObject || that.attrClass.prototype || X.UI.AttrClass,
+		def        = that.supportAttrs[ name ],
+		no         = def.No,
+		v          = attrs[ def.No ],
+		type       = def[ 3 ],
+		list       = def[ 4 ],
+		flag       = !!( type & X.UI.Attr.Type.BOOLEAN ),
+		combi      = !!( type & X.UI.Attr.Type.COMBI   ),
+		quartet    = !!( type & X.UI.Attr.Type.QUARTET );
+
+	if( quartet ){
+		if( attrs[ no + 1 ] === attrs[ no + 3 ] ){
+			if( v === attrs[ no + 2 ] ){
+				if( v === attrs[ no + 1 ] ){
+					return XUI_AbstractUINode_createCssValue( v, type, list );
+				};
+				return [
+					XUI_AbstractUINode_createCssValue( v, type, list ),
+					XUI_AbstractUINode_createCssValue( attrs[ no + 1 ], type, list )
+				].join( ' ' );
+			};
+			return [
+				XUI_AbstractUINode_createCssValue( v, type, list ),
+				XUI_AbstractUINode_createCssValue( attrs[ no + 1 ], type, list ),
+				XUI_AbstractUINode_createCssValue( attrs[ no + 2 ], type, list )
+			].join( ' ' );
+		};
+		return [
+			XUI_AbstractUINode_createCssValue( v, type, list ),
+			XUI_AbstractUINode_createCssValue( attrs[ no + 1 ], type, list ),
+			XUI_AbstractUINode_createCssValue( attrs[ no + 2 ], type, list ),
+			XUI_AbstractUINode_createCssValue( attrs[ no + 3 ], type, list )
+		].join( ' ' );
+	} else
+	if( combi ){
+		return [
+			XUI_AbstractUINode_createCssValue( v, type, list ),
+			XUI_AbstractUINode_createCssValue( attrs[ no + 1 ], type, list )
+		].join( ' ' );
+	} else
+	if( flag ){
+		return v ? list : 'normal'; // 
+	};
+	return XUI_AbstractUINode_createCssValue( v, type, list );
+};
+
+function XUI_AbstractUINode_createCssValue( v, type, list ){
+	var length     = !!( type & X.UI.Attr.Type.LENGTH        ),
+		minusLen   = !!( type & X.UI.Attr.Type.MINUS_LENGTH  ),
+		percent    = !!( type & X.UI.Attr.Type.PERCENT       ),
+		minusPct   = !!( type & X.UI.Attr.Type.MINUS_PERCENT ),
+		numerical  = !!( type & X.UI.Attr.Type.NUMERICAL     ),
+		auto       = !!( type & X.UI.Attr.Type.AUTO          ),
+		color      = !!( type & X.UI.Attr.Type.COLOR         ),
+		url        = !!( type & X.UI.Attr.Type.URL           ),
+		fontName   = !!( type & X.UI.Attr.Type.FONT_NAME     );
+	
+	if( X_Type_isNumber( v ) ){
+		if( auto && v === X.UI.Attr.AUTO ) return 'auto';
+		if( length || minusLen ) return v + 'em';
+		if( numerical ) return v;
+		if( list && list[ v ] ) return list[ v ];
+		if( color ){
+			if( v < 0x100000 ){
+				v = '00000' + v.toString( 16 );
+				return '#' + v.substr( v.length - 6 );
+			};
+			return '#' + v.toString( 16 );
+		};
+	};
+	if( X_Type_isString( v ) ){
+		if( percent || minusPct || url || fontName ) return v;
+	};
+};
+
+function XUI_AbstractUINode_calcValue( styleValue, srcValue ){
 	/*
 	 * String の場合は必ず %
 	 */	
-	if( X.Type.isString( styleValue ) ){
+	if( X_Type_isString( styleValue ) ){
 		return srcValue * parseFloat( styleValue ) / 100;
 	};
-	if( !X.Type.isNumber( styleValue ) ) return 0;
+	if( !X_Type_isNumber( styleValue ) ) return 0;
 	return styleValue;
 };
 
-X.UI._AbstractUINode.finalValue = function( styleValue, styleMin, styleMax, srcValue ){
-	var calc = X.UI._AbstractUINode.calcValue,
-		v    = calc( styleValue, srcValue ),
-		min  = calc( styleMin, srcValue ),
-		max  = calc( styleMax, srcValue );
+function XUI_AbstractUINode_calcFinalValue( styleValue, styleMin, styleMax, srcValue ){
+	var v    = XUI_AbstractUINode_calcValue( styleValue, srcValue ),
+		min  = XUI_AbstractUINode_calcValue( styleMin, srcValue ),
+		max  = XUI_AbstractUINode_calcValue( styleMax, srcValue );
 	return v <= min ? min : max <= v ? max : v;
 };
-X.UI._AbstractUINode.ceil = function( v ){
+function XUI_AbstractUINode_ceil( v ){
 	if( 0 <= v ){
 		return ( v * 10 + 0.999 | 0 ) / 10;
 	};
 	return ( -v * 10 + 0.999 | 0 ) / -10;
 };
 
-X.UI.AbstractUINode = X.Class.create(
+X.UI.AbstractUINode = X_Class_create(
 	'AbstractUINode',
-	X.Class.ABSTRACT | X.Class.SUPER_ACCESS,
+	X_Class.ABSTRACT | X_Class.SUPER_ACCESS,
 	{
 		parent : function(){
 			return X_Class_getPrivate( this ).parent;
@@ -886,10 +890,11 @@ X.UI.AbstractUINode = X.Class.create(
 		attr : function( nameOrObject, valueOrUnit ){
 			var p = X_Class_getPrivate( this ),
 				layout, k, def, attrs, v;
-			if( nameOrObject && X.Type.isObject( nameOrObject ) ){
+			if( nameOrObject && X_Type_isObject( nameOrObject ) ){
 				// setter
 				layout = p.parentData && p.parentData.layout.overrideAttrsForChild; // root には parent がない
 				for( k in nameOrObject ){
+					if( X_EMPTY_OBJECT[ k ] ) continue;
 					// 親のレイアウトマネージャの許可しない
 					if( layout && !layout[ k ] ){
 						continue;
@@ -899,7 +904,7 @@ X.UI.AbstractUINode = X.Class.create(
 					};
 				};
 			} else
-			if( X.Type.isString( nameOrObject ) ){
+			if( X_Type_isString( nameOrObject ) ){
 				if( valueOrUnit !== undefined ){
 					if( 'em,%'.indexOf( valueOrUnit ) === -1 ){
 						// setter
@@ -920,28 +925,28 @@ X.UI.AbstractUINode = X.Class.create(
 		},
 		
 		listen : function( type, arg1, arg2, arg3 ){
-			X_Class_getPrivate( this ).listen( type, arg1, arg2, arg3 );
+			X_Class_getPrivate( this )[ 'listen' ]( type, arg1, arg2, arg3 );
 			return this;
 		},
 		listenOnce : function( type, arg1, arg2, arg3 ){
-			X_Class_getPrivate( this ).listenOnce( type, arg1, arg2, arg3 );
+			X_Class_getPrivate( this )[ 'listenOnce' ]( type, arg1, arg2, arg3 );
 			return this;
 		},
 		listening : function( type, arg1, arg2, arg3 ){
-			return X_Class_getPrivate( this ).listening( type, arg1, arg2, arg3 );
+			return X_Class_getPrivate( this )[ 'listening' ]( type, arg1, arg2, arg3 );
 		},
 		unlisten : function( type, arg1, arg2, arg3 ){
-			X_Class_getPrivate( this ).unlisten( type, arg1, arg2, arg3 );
+			X_Class_getPrivate( this )[ 'unlisten' ]( type, arg1, arg2, arg3 );
 			return this;
 		},
 		dispatch : function( e ){
-			return X_Class_getPrivate( this ).dispatch( e );
+			return X_Class_getPrivate( this )[ 'dispatch' ]( e );
 		},
 			
-		getNextNode : function(){
+		nextNode : function(){
 			
 		},
-		getPrevNode : function(){
+		prevNode : function(){
 			
 		},
 		nodeIndex : function( v ){
@@ -978,23 +983,6 @@ X.UI.AbstractUINode = X.Class.create(
 		getHeight : function(){
 			// dirty の場合、rootData.calculate
 			return X_Class_getPrivate( this ).boxHeight;
-		},
-		scrollTo : function( x, y ){
-			X_Class_getPrivate( this ).scrollTo( x, y );
-		},
-		getScrollX : function( v ){
-			// dirty の場合、rootData.calculate
-			return X_Class_getPrivate( this ).scrollX( v );
-		},
-		getScrollY : function( v ){
-			// dirty の場合、rootData.calculate
-			return X_Class_getPrivate( this ).scrollY( v );
-		},
-		disabled : function( v ){
-			return X_Class_getPrivate( this ).disabled( v );
-		},
-		cursor : function( v ){
-			return X_Class_getPrivate( this ).cursor( v );
 		}
 	}
 );