0.5.x/javascripts/xdoc.js

   1 var BoxModel;\r
   2 \r
   3 var DOM = ( function( window, document ){\r
   4         var DIV_LIST  = [],\r
   5                 SPAN_LIST = [],\r
   6                 TEXT_LIST = [];\r
   7         \r
   8         var elmTextSize;\r
   9         \r
  10         function correctNodes( node ){\r
  11                 var child;\r
  12                 if( node && node.parentNode ){\r
  13                         while( node.lastChild ) correctNodes( node.lastChild );\r
  14                         node.parentNode.removeChild( node );\r
  15                         if( node.nodeType === 1 ){\r
  16                                 switch( node.tagName ){\r
  17                                         case 'DIV':\r
  18                                                 DIV_LIST.push( node );\r
  19                                                 break;\r
  20                                         case 'SPAN':\r
  21                                                 SPAN_LIST.push( node );\r
  22                                                 break;\r
  23                                         \r
  24                                 };\r
  25                                 node.removeAttribute( 'className' );\r
  26                                 node.removeAttribute( 'style' );\r
  27                                 node.removeAttribute( 'id' );\r
  28                         } else\r
  29                         if( node.nodeType === 3 ){\r
  30                                 node.data = '';\r
  31                                 TEXT_LIST.push( node );\r
  32                         };\r
  33                 };\r
  34         };\r
  35         \r
  36         return {\r
  37                 createDiv : function(){\r
  38                         return 0 < DIV_LIST.length ? DIV_LIST.shift() : document.createElement( 'div' );\r
  39                 },\r
  40                 createSpan : function(){\r
  41                         \r
  42                 },\r
  43                 createText : function(){\r
  44                         \r
  45                 },\r
  46                 getTextSize : function( elm, content ){\r
  47                         var span = DOM.createSpan(),\r
  48                                 text = DOM.createText(),\r
  49                                 w, h;\r
  50                         elm.appendChild( span );\r
  51                         span.style.cssText = 'visibility:hidden;position:absolute;';\r
  52                         span.appendChild( text );\r
  53                         text.data = content;\r
  54                         w = span.offsetWidth;\r
  55                         h = span.offsetHeight;\r
  56                         DOM.correctNodes( span );\r
  57                         return [ w, h ];\r
  58                 },\r
  59                 getTextHeight : function( elm, w, content ){\r
  60                         var div  = DOM.createSpan(),\r
  61                                 text = DOM.createText(),\r
  62                                 w, h;\r
  63                         elm.appendChild( div );\r
  64                         div.style.cssText = 'visibility:hidden;position:absolute;width:' + w + 'px;';\r
  65                         div.appendChild( text );\r
  66                         text.data = content;\r
  67                         w = div.offsetWidth;\r
  68                         h = div.offsetHeight;\r
  69                         DOM.correctNodes( div );\r
  70                         return h;\r
  71                 },\r
  72                 correctNodes : function( node ){\r
  73                         var child;\r
  74                         if( node && node.parentNode ){\r
  75                                 while( node.lastChild ) DOM.correctNodes( node.lastChild );\r
  76                                 node.parentNode.removeChild( node );\r
  77                                 if( node.nodeType === 1 ){\r
  78                                         switch( node.tagName ){\r
  79                                                 case 'DIV':\r
  80                                                         DIV_LIST.push( node );\r
  81                                                         break;\r
  82                                                 case 'SPAN':\r
  83                                                         SPAN_LIST.push( node );\r
  84                                                         break;\r
  85                                                 \r
  86                                         };\r
  87                                         node.removeAttribute( 'className' );\r
  88                                         node.removeAttribute( 'style' );\r
  89                                         node.removeAttribute( 'id' );\r
  90                                 } else\r
  91                                 if( node.nodeType === 3 ){\r
  92                                         node.data = '';\r
  93                                         TEXT_LIST.push( node );\r
  94                                 };\r
  95                         };\r
  96                 }\r
  97         }\r
  98 })( window, document );\r
  99 \r
 100 var XBrowserStyle = ( function(){\r
 101         var     EMPTY          = '',\r
 102                 CORON          = ':',\r
 103                 SEMICORON      = ';',\r
 104                 SPACE          = ' ',\r
 105                 UNITS          = 'px,cm,mm,in,pt,pc,em,%'.split( ',' ),\r
 106                 CLIP_SEPARATOR = UA.isIE === true && UA.ieVersion < 8 ? ' ' : ',';\r
 107 \r
 108         var SPECIAL = ( function(){\r
 109                 var special = {};\r
 110                 if( UA.isIE === true && UA.ieVersion < 9 ){\r
 111                         if( UA.ACTIVEX === true ){\r
 112                                 // special.opacity    = 'ActiveXOpacity';\r
 113                                 special.setFilters = function( style ){\r
 114                                         var filters = ( style.filter || '' ).split( ') ' ),\r
 115                                                 data    = {},\r
 116                                                 i       = filters.length,\r
 117                                                 filter, names, props, prop, j, l, key, v;\r
 118                                         for( ; i; ){\r
 119                                                 filter   = filters[ --i ].split( ' ' ).join( '' ).split( '(' );\r
 120                                                 if( filter.length !== 2 ) continue;\r
 121                                                 names    = filter[ 0 ].split( '.' ); // progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9)\r
 122                                                 props    = filter[ 1 ].split( ',' ); // \r
 123                                                 filter   = {};\r
 124                                                 for( j = 0, l = props.length; j < l; ++j ){\r
 125                                                         prop = props[ j ].split( '=' );\r
 126                                                         key  = prop[ 0 ].toLowerCase();\r
 127                                                         v    = prop[ 1 ];\r
 128                                                         filter[ key ] = v; //v.charAt( 0 ) === '#' ? v : parseInt( v );\r
 129                                                 };\r
 130                                                 data[ names[ names.length - 1 ] ] = filter;\r
 131                                         };\r
 132                                         \r
 133                                         style.filter  = data;\r
 134                                         style.opacity = data.alpha && data.alpha.opacity ? data.alpha.opacity / 100 : 1;\r
 135                                 };\r
 136                                 special.hasLayout = function( elm ){\r
 137                                         return elm.currentStyle.hasLayout;\r
 138                                 };\r
 139                         } else {\r
 140                                 special.opacity = null;\r
 141                         };\r
 142                 } else {\r
 143                         var style = document.documentElement.style;\r
 144                         special.opacity = style.opacity           !== undefined ? 'opacity' : \r
 145                                                         style.MozOpacity          !== undefined ? 'MozOpacity' :\r
 146                                                         style.KhtmlOpacity        !== undefined ? 'KhtmlOpacity' :\r
 147                                                         style[ '-khtml-opacity' ] !== undefined ? 'KhtmlOpacity' : null;\r
 148 \r
 149                         // if( style.backgroundPositionX === undefined ){\r
 150                                 special.setBackgroundPositionXY = function( style ){\r
 151                                         var bgp = ( style.backgroundPosition || '' ).split( ' ' );\r
 152                                         style.backgroundPositionX = bgp[ 0 ] || 0;\r
 153                                         style.backgroundPositionY = bgp[ 1 ] || 0;\r
 154                                 };\r
 155                         // };\r
 156                         if( style.clipTop === undefined && style[ 'clip-top' ] === undefined ){\r
 157                                 special.setClipTopRightBottomLeft = function( style ){\r
 158                                         var clip = style.clip;\r
 159                                         if( !cliop || clip.indexOf( 'rect(' ) === -1 ){\r
 160                                                 style.clipTop    = 0;\r
 161                                                 style.clipRight  = 0;\r
 162                                                 style.clipBottom = 0;\r
 163                                                 style.clipLeft   = 0;\r
 164                                                 return;\r
 165                                         };\r
 166                                         clip = clip.split( '(' )[ 1 ].split( ')' )[ 0 ].split( clip.indexOf( ',' ) !== -1 ? ',' : ' ' );\r
 167                                         ret.clipTop    = clip[ 0 ];\r
 168                                         ret.clipRight  = clip[ 1 ];\r
 169                                         ret.clipBottom = clip[ 2 ];\r
 170                                         ret.clipLeft   = clip[ 3 ];\r
 171                                 };\r
 172                         };\r
 173                 };\r
 174                 return special;\r
 175         })();\r
 176         \r
 177         function cssToObject( css ){\r
 178                 var ret      = {}, i, nv, n, v,\r
 179                         parse    = Util.parse,\r
 180                         isNumber = Type.isNumber,\r
 181                         camelize = Util.camelize;\r
 182                 if( Type.isString( css ) === true ){\r
 183                         css = css.split( SEMICORON );\r
 184                         for( i = css.length; i; ){\r
 185                                 nv = css[ --i ].split( CORON ); // filter の場合, progid: がくる\r
 186                                 n  = nv.shift();\r
 187                                 if( isNumber( parse( n ) ) === true ) continue;\r
 188                                 v  = nv.join( EMPTY );\r
 189                                 while( v.charAt( 0 ) === ' ' ) v = v.substr( 1 );\r
 190                                 ret[ camelize( n ) ] = parse( v );\r
 191                         };\r
 192                 } else {\r
 193                         for( n in css ){\r
 194                                 if( Type.isNumber( parse( n ) ) === false ) ret[ n ] = parse( css[ n ] );\r
 195                         };\r
 196                 };\r
 197 \r
 198                 if( SPECIAL.setFilters ){\r
 199                         SPECIAL.setFilters( ret );\r
 200                 } else {\r
 201                         ret.opacity = SPECIAL.opacity !== null ? ret[ SPECIAL.opacity ] : 1;\r
 202                 };\r
 203                 \r
 204                 SPECIAL.setBackgroundPositionXY && SPECIAL.setBackgroundPositionXY( ret );\r
 205                 SPECIAL.setClipTopRightBottomLeft && SPECIAL.setClipTopRightBottomLeft( ret );\r
 206                 \r
 207                 return ret;\r
 208         };\r
 209 \r
 210         var COLOR = ( function(){\r
 211                 var ret = {}, v, name,\r
 212                         list = [\r
 213                                 '0', 'BLACK',\r
 214                                 'FF0000', 'RED',\r
 215                                 '00FF00', 'LIME',\r
 216                                 '0000FF', 'BLUE',\r
 217                                 'FFFF00', 'YELLOW',\r
 218                                 '00FFFF', 'AQUA',\r
 219                                 '00FFFF', 'CYAN',\r
 220                                 'FF00FF', 'MAGENTA',\r
 221                                 'FF00FF', 'FUCHSIA',\r
 222                                 'FFFFFF', 'WHITE',\r
 223                                 '008000', 'GREEN',\r
 224                                 '800080', 'PURPLE',\r
 225                                 '800000', 'MAROON',\r
 226                                 '000080', 'NAVY',\r
 227                                 '808000', 'OLIVE',\r
 228                                 '008080', 'TEAL',\r
 229                                 '808080', 'GRAY',\r
 230                                 'C0C0C0', 'SILVER',\r
 231                                 '696969', 'DIMGRAY',\r
 232                                 '708090', 'SLATEGRAY',\r
 233                                 'A9A9A9', 'DARKGRAY',\r
 234                                 'DCDCDC', 'GAINSBORO',\r
 235                                 '191970', 'MIDNIGHTBLUE',\r
 236                                 '6A5ACD', 'SLATEBLUE',\r
 237                                 '0000CD', 'MEDIUMBLUE',\r
 238                                 '4169E1', 'ROYALBLUE',\r
 239                                 '1E90FF', 'DODGERBLUE',\r
 240                                 '87CEEB', 'SKYBLUE',\r
 241                                 '4682B4', 'STEELBLUE',\r
 242                                 'ADD8E6', 'LIGHTBLUE',\r
 243                                 'AFEEEE', 'PALETURQUOISE',\r
 244                                 '40E0D0', 'TURQUOISE',\r
 245                                 'E0FFFF', 'LIGHTCYAN',\r
 246                                 '7FFFD4', 'AQUAMARINE',\r
 247                                 '006400', 'DARKGREEN',\r
 248                                 '2E8B57', 'SEAGREEN',\r
 249                                 '90EE90', 'LIGHTGREEN',\r
 250                                 '7FFF00', 'CHARTREUSE',\r
 251                                 'ADFF2F', 'GREENYELLOW',\r
 252                                 '32CD32', 'LIMEGREEN',\r
 253                                 '9ACD32', 'YELLOWGREEN',\r
 254                                 '6B8E23', 'OLIVEDRAB',\r
 255                                 'BCB76B', 'DARKKHAKI',\r
 256                                 'EEE8AA', 'PALEGOLDENROD',\r
 257                                 'FFFFE0', 'LIGHTYELLOW',\r
 258                                 'FFD700', 'GOLD',\r
 259                                 'DAA520', 'GOLDENROD',\r
 260                                 'B8860B', 'DARKGOLDENROD',\r
 261                                 'BC8F8F', 'ROSYBROWN',\r
 262                                 'CD5C5C', 'INDIANRED',\r
 263                                 '8B4513', 'SADDLEBROWN',\r
 264                                 'A0522D', 'SIENNA',\r
 265                                 'CD853F', 'PERU',\r
 266                                 'DEB887', 'BURLYWOOD',\r
 267                                 'F5F5DC', 'BEIGE',\r
 268                                 'F5DEB3', 'WHEAT',\r
 269                                 'F4A460', 'SANDYBROWN',\r
 270                                 'D2B48C', 'TAN',\r
 271                                 'D2691E', 'CHOCOLATE',\r
 272                                 'B22222', 'FIREBRICK',\r
 273                                 'A52A2A', 'BROWN',\r
 274                                 'FA8072', 'SALMON',\r
 275                                 'FFA500', 'ORANGE',\r
 276                                 'FF7F50', 'CORAL',\r
 277                                 'FF6347', 'TOMATO',\r
 278                                 'FF69B4', 'HOTPINK',\r
 279                                 'FFC0CB', 'PINK',\r
 280                                 'FF1493', 'DEEPPINK',\r
 281                                 'DB7093', 'PALEVIOLETRED',\r
 282                                 'EE82EE', 'VIOLET',\r
 283                                 'DDA0DD', 'PLUM',\r
 284                                 'DA70D6', 'ORCHILD',\r
 285                                 '9400D3', 'DARKVIOLET',\r
 286                                 '8A2BE2', 'BLUEVIOLET',\r
 287                                 '9370DB', 'MEDIUMPURPLE',\r
 288                                 'D8BFD8', 'THISTLE',\r
 289                                 'E6E6FA', 'LAVENDER',\r
 290                                 'FFE4E1', 'MISTYROSE',\r
 291                                 'FFFFF0', 'IVORY',\r
 292                                 'FFFACD', 'LEMONCHIFFON'\r
 293                         ];\r
 294                 for( i = list.length; i; ){\r
 295                         v    = list[ --i ];\r
 296                         name = list[ --i ];\r
 297                         ret[ name ] = parseInt( v, 16 );\r
 298                 };\r
 299                 return ret;\r
 300         })();\r
 301         \r
 302         var PARAMS = ( function(){\r
 303                 var ret = {};\r
 304                 register( ret.percent = {},\r
 305                         'marginBottom,marginLeft,marginRight,marginTop,paddingBottom,paddingLeft,paddingRight,paddingTop,fontSize,textIndent'\r
 306                 );\r
 307                 register( ret.offset = {},\r
 308                         'height,width,bottom,left,right,top'\r
 309                 );              \r
 310                 register( ret.size = {},\r
 311                         'borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth,letterSpacing'\r
 312                 );\r
 313                 register( ret.color = {},\r
 314                         'backgroundColor,borderBottomColor,borderLeftColor,borderRightColor,borderTopColor,color'\r
 315                 );\r
 316                 register( ret.region = {},\r
 317                         'margin,padding,borderWidth,borderColor'\r
 318                 );              \r
 319                 register( ret.special = {},\r
 320                         'clip,backgroundPosition,opacity,lineHeight,zIndex'\r
 321                 );\r
 322                 register( ret.unit = {}, 'px,cm,mm,in,pt,pc,em,%' );\r
 323                 \r
 324                 register( ret.margin = {}, 'marginBottom,marginLeft,marginRight,marginTop,paddingBottom' );\r
 325                 register( ret.padding = {}, 'paddingBottom,paddingLeft,paddingRight,paddingTop' );\r
 326                 register( ret.borderWidth = {}, 'borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth' );\r
 327                 register( ret.borderColor = {}, 'borderBottomColor,borderLeftColor,borderRightColor,borderTopColor' );\r
 328                 \r
 329                 function register( obj, params ){\r
 330                         params = params.split( ',' );\r
 331                         for( var i=params.length; i; ) obj[ params[ --i ] ] = true;\r
 332                 };\r
 333                 return ret;\r
 334         })();\r
 335         \r
 336         /*\r
 337          * \r
 338          */\r
 339         var Property = Class.create(\r
 340                 'Property',\r
 341                 Class.POOL_OBJECT,\r
 342                 {\r
 343                         Constructor : function( name, value, unit, pxPerEm ){\r
 344                                 this.name    = name;\r
 345                                 this.value   = value;\r
 346                                 this.unit    = unit;\r
 347                                 this.pxPerEm = pxPerEm; // XXpx = 1em;\r
 348                         },\r
 349                         name    : '',\r
 350                         value   : 0,\r
 351                         pxPerEm : 12, // 1em === ??px\r
 352                         unit    : '',\r
 353                         equal : function( prop ){\r
 354                                 if( this.unit === prop.unit ){\r
 355                                         return this.value === prop.value;\r
 356                                 };\r
 357                                 return Math.abs( this.toPx() - prop.toPx() ) < 1;\r
 358                         },\r
 359                         convert: function( prop ){\r
 360                                 var u = prop.unit, v;\r
 361                                 if( this.unit === u ) return;\r
 362                                 this.value = v = this.toPx();\r
 363                                 this.unit  = u;\r
 364                                 if( u !== px ){\r
 365                                         this.value = u === 'em' ? v / this.pxPerEm : Util.pxTo( v, u );\r
 366                                 };\r
 367                         },\r
 368                         setValue: function( v ){\r
 369                                 this.value = v;\r
 370                         },\r
 371                         getValue: function(){\r
 372                                 return this.value;\r
 373                         },\r
 374                         getOffset: function( prop ){\r
 375                                 return prop.value - this.value;\r
 376                         },\r
 377                         getUnit: function(){\r
 378                                 return this.unit;\r
 379                         },\r
 380                         getValueText: function(){\r
 381                                 return this.value === 0 ? '0' : this.value + this.unit;\r
 382                         },\r
 383                         toPx: function(){\r
 384                                 var v = this.value, u = this.unit;\r
 385                                 if( u === px )   return v;\r
 386                                 if( u === 'em' ) return v * this.pxPerEm;\r
 387                                 if( u === '' && this.name === 'lineHeight' ) return v * this.pxPerEm;\r
 388                                 return Util.toPx( v, u );\r
 389                         },\r
 390                         isValid: function( t ){\r
 391                                 t = t || this;\r
 392                                 var n = t.name,\r
 393                                         v = t.value,\r
 394                                         u = t.unit,\r
 395                                         z = u !== '' ? true : v === 0;\r
 396                                 if( PARAMS.percent[ n ] === true ) return z;\r
 397                                 if( PARAMS.offset[ n ] === true  ) return z;\r
 398                                 if( PARAMS.size[ n ] === true  )   return z && u !== '%';\r
 399                                 if( PARAMS.special[ n ] === true  ){\r
 400                                         if( n === 'lineHeight' ) return true;\r
 401                                         if( n === 'opacity' )    return 0 <= v && v <= 1 && u === '';\r
 402                                         if( n === 'zIndex'  )    return u === '';\r
 403                                 };\r
 404                                 return false;\r
 405                         }\r
 406                 }\r
 407         );\r
 408         \r
 409         /**\r
 410          * backgroundPosition, clip\r
 411          */\r
 412         var PropertyGroup = Class.create(\r
 413                 'PropertyGroup',\r
 414                 Class.POOL_OBJECT,\r
 415                 {\r
 416                         Constructor : function( name ){\r
 417                                 this.name  = name;\r
 418                                 this.props = [];\r
 419                                 for( var i = 1, l = arguments.length; i<l; ++i ){\r
 420                                         this.props.push( arguments[ i ] );\r
 421                                 };\r
 422                         },\r
 423                         name  : '',\r
 424                         equal : function( prop ){\r
 425                                 var ps = this.props, i = ps.length;\r
 426                                 for( ; i; ){\r
 427                                         --i;\r
 428                                         if( ps[ i ].equal( prop[ i ] ) === false ) return false;\r
 429                                 };\r
 430                                 return true;\r
 431                         },\r
 432                         convert : function( prop ){\r
 433                                 var ps = this.props, i = ps.length;\r
 434                                 for( ; i; ){\r
 435                                         --i;\r
 436                                         ps[ i ].convert( prop[ i ] );\r
 437                                 };\r
 438                         },\r
 439                         setValue : function( ary ){\r
 440                                 var ps = this.props, i = 0, l = ps.length;\r
 441                                 for( ; i<l; ++i ){\r
 442                                         ps[ i ].setValue( ary[ i ] );\r
 443                                 };\r
 444                         },\r
 445                         getValue : function(){\r
 446                                 var ret = [], ps = this.props, i = 0, l = ps.length;\r
 447                                 for( ; i<l; ++i ){\r
 448                                         ret.push( ps[ i ].getValue() );\r
 449                                 };\r
 450                                 return ret;\r
 451                         },\r
 452                         getOffset : function( prop ){\r
 453                                 var ret = [],\r
 454                                         ps  = this.props,\r
 455                                         _ps = prop.props,\r
 456                                         i   = 0,\r
 457                                         l = ps.length;\r
 458                                 for( ; i<l; ++i ){\r
 459                                         ret.push( ps[ i ].getOffset( _ps[ i ] ) );\r
 460                                 };\r
 461                                 return ret;\r
 462                         },\r
 463                         getUnit : function(){\r
 464                                 var ret = [], ps = this.props, i = 0, l = ps.length;\r
 465                                 for( ; i<l; ++i ){\r
 466                                         ret.push( ps[ i ].getUnit() );\r
 467                                 };\r
 468                                 return ret;\r
 469                         },\r
 470                         getValueText : function(){\r
 471                                 var ret = [], ps = this.props, i = 0, l = ps.length;\r
 472                                 for( ; i<l; ++i ){\r
 473                                         ret.push( ps[ i ].getValueText() );\r
 474                                 };                      \r
 475                                 if( this.name === 'clip' ){\r
 476                                         return 'rect(' + ret.join( CLIP_SEPARATOR ) + ')';\r
 477                                 };\r
 478                                 return ret.join( ' ' );\r
 479                         },\r
 480                         onKill : function(){\r
 481                                 var ps = this.props, i = ps.length;\r
 482                                 for( ; i; ){\r
 483                                         ps[ --i ].kill();\r
 484                                 };\r
 485                         },\r
 486                         isValid : function( t ){\r
 487                                 t = t || this;\r
 488                                 var ps = t.props, i = ps.length;\r
 489                                 for( ; i; ){\r
 490                                         if( ps[ --i ].isValid() === false ) return false;\r
 491                                 };\r
 492                                 return true;\r
 493                         }\r
 494                 }\r
 495         );\r
 496         \r
 497         /**\r
 498          * margin, padding, borderWidth, borderColor\r
 499          */\r
 500         var FrexibleProperty = PropertyGroup.inherits(\r
 501                 'FrexibleProperty',\r
 502                 Class.POOL_OBJECT, {\r
 503                         Constructor : function( name ){\r
 504                                 this.name  = name;\r
 505                                 this.props = [];\r
 506                                 for( var i = 1, l = arguments.length; i<l; ++i ){\r
 507                                         this.props.push( arguments[ i ] );\r
 508                                 };\r
 509                                 // top, bottom, left, right, topbottom, leftright, all                          \r
 510                         }\r
 511                 }\r
 512         );\r
 513 \r
 514         var ColorProperty = Class.create(\r
 515                 'ColorProperty',\r
 516                 Class.POOL_OBJECT, {\r
 517                         Constructor : function( name, r, g, b, pct ){\r
 518                                 this.name = name;\r
 519                                 this.r    = r;\r
 520                                 this.g    = g;\r
 521                                 this.b    = b;\r
 522                                 this.pct  = pct;\r
 523                         },\r
 524                         name  : '',\r
 525                         equal : function( prop ){\r
 526                                 if( this.pct === prop.pct ){\r
 527                                         return this.r === prop.r && this.g === prop.g && this.b === prop.b;\r
 528                                 };\r
 529                                 var rgb  = this._toPct(),\r
 530                                         _rgb = prop._toPct(),\r
 531                                         i    = rgb.length;\r
 532                                 for( ; i; ){\r
 533                                         --i;\r
 534                                         if( Math.abs( rgb[ i ] - _rgb[ i ] ) > 1 ) return false;\r
 535                                 };\r
 536                                 return true;\r
 537                         },\r
 538                         convert : function( prop ){\r
 539                                 var u = prop.pct, x;\r
 540                                 if( this.pct === u ) return;\r
 541                                 x = u === true ? 100 / 255 : 2.55;\r
 542                                 this.r  *= x;\r
 543                                 this.g  *= x;\r
 544                                 this.b  *= x;\r
 545                                 this.pct = u;\r
 546                         },\r
 547                         setValue : function( rgb ){\r
 548                                 this.r = rgb[ 0 ];\r
 549                                 this.g = rgb[ 1 ];\r
 550                                 this.b = rgb[ 2 ];\r
 551                         },\r
 552                         getValue : function(){\r
 553                                 return [ this.r, this.g, this.b ];\r
 554                         },\r
 555                         getOffset : function( prop ){\r
 556                                 return [ prop.r - this.r, prop.g - this.g, prop.b - this.b ];\r
 557                         },\r
 558                         getUnit : function(){\r
 559                                 return this.pct === true ? '%' : '';\r
 560                         },\r
 561                         getValueText : function(){\r
 562                                 if( this.pct === true ){\r
 563                                         return [ 'rgb(', this.r, '%,', this.g, '%,', this.b, '%)' ].join( '' );\r
 564                                 };\r
 565                                 var round = Math.round;\r
 566                                 //return [ 'rgb(', round( this.r ), ',', round( this.g ), ',', round( this.b ), ')' ].join( '' );\r
 567                                 \r
 568                                 var rgb   = '00000' + ( ( round( this.r ) << 16 ) + ( round( this.g ) << 8 ) + round( this.b ) ).toString( 16 );\r
 569                                 return '#' + rgb.substr( rgb.length - 6 );\r
 570                         },\r
 571                         _toPct : function(){\r
 572                                 if( this.pct === true ) return [ this.r, this.g, this.b ];\r
 573                                 return [ this.r / 2.55, this.g / 2.55, this.b / 2.55 ];\r
 574                         },\r
 575                         isValid : function( t ){\r
 576                                 var isFinite = window.isFinite;\r
 577                                 if( !isFinite( this.r ) || !isFinite( this.g ) || !isFinite( this.b ) ) return false;\r
 578                                 if( 0 > this.r || 0 > this.g || 0 > this.b ) return false;\r
 579                                 if( this.pct === true ) return this.r <= 100 && this.g <= 100 && this.b <= 100;\r
 580                                 return this.r <= 255 && this.g <= 255 && this.b <= 255;\r
 581                         }\r
 582                 }\r
 583         );\r
 584         \r
 585         var isString       = Type.isString,\r
 586                 isNumber       = Type.isNumber;\r
 587         var REG_UINIT      = /.*\d(\w{1,2})?/,\r
 588                 $1             = '$1',\r
 589                 px             = 'px',\r
 590                 REG_XXXXXX     = /^#[\da-fA-F]{6}?/,\r
 591                 REG_XXX        = /^#[\da-fA-F]{3}?/;\r
 592         \r
 593         var WrappedStyle = Class.create(\r
 594                 'WrappedStyle',\r
 595                 Class.POOL_OBJECT,\r
 596                 {\r
 597                         Constructor : function( style ){\r
 598                                 this.style   = style;\r
 599                                 var fontsize = this.get( 'fontSize' );\r
 600                                 this.pxPerEm = fontsize.toPx();\r
 601                                 fonstsize.kill();\r
 602                         },\r
 603                         get: function( p ){\r
 604                                 if( PARAMS.special[ p ] === true || PARAMS.region[ p ] === true ){\r
 605                                         if( p === 'clip' )        return this.getClip();\r
 606                                         if( p === 'margin' )      return this.getMarginPaddingBorder( p, '' );\r
 607                                         if( p === 'padding' )     return this.getMarginPaddingBorder( p, '' );\r
 608                                         if( p === 'borderWidth' ) return this.getMarginPaddingBorder( 'border', 'Width' );\r
 609                                         if( p === 'borderColor' ) return this.getBorderColor( 'borderColor' );\r
 610                                         if( p === 'backgroundPosition' ) return this.getBackgroundPosition( p );\r
 611                                         // opacity, zindex, lineHeight\r
 612                                         return new Property( p, this.getValue( x ), this.getUnit( x ), this.pxPerEm );\r
 613                                 };\r
 614                                 var x = this.style[ p ], e, v, u;\r
 615                                 if( PARAMS.offset[ p ] === true ){\r
 616                                         return new Property( p, this.getValue( x ), this.getUnit( x, p ), this.pxPerEm );\r
 617                                         /*\r
 618                                         e = this.elm;\r
 619                                         if( p === 'width'  ) v = e.offsetWidth;\r
 620                                         if( p === 'height' ) v = e.offsetHeight;\r
 621                                         if( p === 'top'    ) v = e.offsetTop;\r
 622                                         if( p === 'bottom' ) v = e.offsetBottom;\r
 623                                         if( p === 'left'   ) v = e.offsetLeft;\r
 624                                         if( p === 'right'  ) v = e.offsetRight;\r
 625                                         u = this.getUnit( x, p );\r
 626                                         // alert( p + this.pxTo( v, u ) + u )\r
 627                                         return new Property( p, this.pxTo( v, u ), u, this.pxPerEm ); */\r
 628                                 };\r
 629                                 if( p === 'fontSize' ){ // xx-small 等\r
 630                                         v = Util.absoluteFontSizeToPx( x );\r
 631                                         if( v !== 0 ){\r
 632                                                 return new Property( p, v, px, this.pxPerEm );\r
 633                                         };\r
 634                                 };                      \r
 635                                 if( PARAMS.percent[ p ] === true ){\r
 636                                         // alert( p + ' , ' + x + ' , ' + this.getUnit( x, p ) )\r
 637                                         return new Property( p, this.getValue( x ), this.getUnit( x, p ), this.pxPerEm );\r
 638                                 };\r
 639                                 if( PARAMS.size[ p ] === true ){\r
 640                                         return new Property( p, this.getValue( x ), this.getUnit( x, p ), this.pxPerEm );\r
 641                                 };\r
 642                                 if( PARAMS.color[ p ] === true ){\r
 643                                         return this.getColor( x, p );\r
 644                                 };\r
 645                         },\r
 646                         pxTo: function( px, unit ){\r
 647                                 if( unit === 'em' ) return px / this.pxPerEm;\r
 648                                 return Util.pxTo( px, unit );\r
 649                         },\r
 650                         getValue: function( x ){\r
 651                                 return isString( x ) === true ? parseInt( x ) :\r
 652                                        isNumber( x ) === true ? x : 0;\r
 653                         },\r
 654                         getUnit: function( x, p ){\r
 655                                 var u;\r
 656                                 if( isString( x ) === true ){\r
 657                                         u = x.replace( REG_UINIT, $1 );\r
 658                                         if( p === 'lineHeight' ) return u;\r
 659                                         if( PARAMS.unit[ u ] !== true ) return px;\r
 660                                         return u;\r
 661                                 };\r
 662                                 return px;\r
 663                         },\r
 664                         getColor: function( x, p ){\r
 665                                 var rgb = COLOR[ x.toUpperCase() ],\r
 666                                         pct = false,\r
 667                                         r   = 0,\r
 668                                         g   = 0,\r
 669                                         b   = 0;\r
 670                                 if( isNumber( rgb ) === true ){\r
 671                                         r = ( rgb & 0xff0000 ) >> 16;\r
 672                                         g = ( rgb & 0xff00 ) >> 8;\r
 673                                         b = ( rgb & 0xff );\r
 674                                 } else\r
 675                                 if( x.match( REG_XXXXXX ) ){\r
 676                                         r = parseInt( x.charAt( 1 ) + x.charAt( 2 ), 16 );\r
 677                                         g = parseInt( x.charAt( 3 ) + x.charAt( 4 ), 16 );\r
 678                                         b = parseInt( x.charAt( 5 ) + x.charAt( 6 ), 16 );\r
 679                                         //alert( x + ' g: ' + g )\r
 680                                 } else                  \r
 681                                 if( x.match( REG_XXX ) ){\r
 682                                         r = parseInt( x.charAt( 1 ) + x.charAt( 1 ), 16 );\r
 683                                         g = parseInt( x.charAt( 2 ) + x.charAt( 2 ), 16 );\r
 684                                         b = parseInt( x.charAt( 3 ) + x.charAt( 3 ), 16 );\r
 685                                 } else\r
 686                                 if( x.indexOf( 'rgb(' ) === 0 ){\r
 687                                         rgb = x.substr( 4 ).split( ',' );\r
 688                                         r = parseFloat( rgb[ 0 ] );\r
 689                                         g = parseFloat( rgb[ 1 ] );\r
 690                                         b = parseFloat( rgb[ 2 ] );\r
 691                                         if( x.indexOf( '%' ) !== -1 ) pct = true;\r
 692                                 } else {\r
 693                                         r = 255;\r
 694                                         g = 255;\r
 695                                         b = 255;\r
 696                                 };\r
 697                                 return new ColorProperty( p, r, g, b, pct );\r
 698                         },\r
 699                         getClip: function( name ){\r
 700                                 // rect(...)    クリップします。<top>, <bottom> は上端からの、 <right>, <left> は左端からのオフセットで指定します。Internet Explorer 4～7 では、カンマの代わりにスペースで区切る必要があります。\r
 701                                 // position:absolute または position:fixed を適用した要素に対してのみ有効です。\r
 702                                 var top    = this.get( name + 'Top' ),\r
 703                                         right  = this.get( name + 'Right' ),\r
 704                                         bottom = this.get( name + 'Bottom' ),\r
 705                                         left   = this.get( name + 'Left' ),\r
 706                                         ret    = new PropertyGroup( name, top, right, bottom, left),\r
 707                     all;\r
 708                                 if( ret.isValid() === true ) return ret;\r
 709                                 ret.kill();\r
 710                                 all    = this.style[ name ].split( '(' )[ 1 ].split( ')' )[ 0 ].split( CLIP_SEPARATOR );\r
 711                                 return new PropertyGroup( name,\r
 712                                         new Property( name + 'Top',    all[ 0 ], px, this.pxPerEm ),\r
 713                                         new Property( name + 'Right',  all[ 1 ], px, this.pxPerEm ),\r
 714                                         new Property( name + 'Bottom', all[ 2 ], px, this.pxPerEm ),\r
 715                                         new Property( name + 'Left',   all[ 3 ], px, this.pxPerEm )\r
 716                                 );\r
 717                         },\r
 718                         getBackgroundPosition: function( name ){\r
 719                                 var x   = this.get( name + 'X' ),\r
 720                                         y   = this.get( name + 'Y' ),\r
 721                                         ret = new PropertyGroup( name, x, y ),\r
 722                                         xy;\r
 723                                 if( ret.isValid() === true ) return ret;\r
 724                                 ret.kill();\r
 725                                 xy  = this.style[ name ].split( ' ' );\r
 726                                 return new PropertyGroup( name,\r
 727                                         new Property( name + 'X', this.getValue( xy[ 0 ] ), this.getUnit( xy[ 0 ] ), this.pxPerEm ),\r
 728                                         new Property( name + 'Y', this.getValue( xy[ 1 ] ), this.getUnit( xy[ 1 ] ), this.pxPerEm )\r
 729                                 );\r
 730                         },\r
 731                         getMarginPaddingBorder: function( name, width ){\r
 732                                 var props  = [ name + 'Top'    + width,\r
 733                                                    name + 'Right'  + width,\r
 734                                                    name + 'Bottom' + width,\r
 735                                                    name + 'Left'   + width ],\r
 736                                         top    = this.get( props[ 0 ] ),\r
 737                                         right  = this.get( props[ 1 ] ),\r
 738                                         bottom = this.get( props[ 2 ] ),\r
 739                                         left   = this.get( props[ 3 ] ),\r
 740                                         ret    = new FrexibleProperty( name, top, right, bottom, left ),\r
 741                                         klass, pxPerEm, getValue, getUnit,\r
 742                                         all, _0, _1, _2, _3, v, u;\r
 743                                 if( ret.isValid() === true ) return ret;\r
 744                                 ret.kill();\r
 745                                 klass    = Property;\r
 746                                 pxPerEm  = this.pxPerEm;\r
 747                                 getValue = this.getValue;\r
 748                                 getUnit  = this.getUnit;\r
 749                                 all = this.style[ name + width ].split( ' ' );\r
 750                                 _0 = all[ 0 ];\r
 751                                 _1 = all[ 1 ];\r
 752                                 _2 = all[ 2 ];\r
 753                                 _3 = all[ 3 ];\r
 754                                 v  = getValue( _0 );\r
 755                                 u  = getUnit( _0 );\r
 756                                 switch( all.length ){\r
 757                                         case 1 :\r
 758                                                 top    = new klass( props[ 0 ], v, u, pxPerEm );\r
 759                                                 right  = new klass( props[ 1 ], v, u, pxPerEm );\r
 760                                                 bottom = new klass( props[ 2 ], v, u, pxPerEm );\r
 761                                                 left   = new klass( props[ 3 ], v, u, pxPerEm );\r
 762                                                 break;\r
 763                                         case 2 :\r
 764                                                 top    = new klass( props[ 0 ], v, u, pxPerEm );\r
 765                                                 bottom = new klass( props[ 2 ], v, u, pxPerEm );\r
 766                                                 v  = getValue( _1 );\r
 767                                                 u  = getUnit( _1 );\r
 768                                                 right  = new klass( props[ 1 ], v, u, pxPerEm );\r
 769                                                 left   = new klass( props[ 3 ], v, u, pxPerEm );\r
 770                                                 break;\r
 771                                         case 3 :\r
 772                                                 top    = new klass( props[ 0 ], v, u, pxPerEm );\r
 773                                                 v  = getValue( _1 );\r
 774                                                 u  = getUnit( _1 );\r
 775                                                 right  = new klass( props[ 1 ], v, u, pxPerEm );\r
 776                                                 left   = new klass( props[ 3 ], v, u, pxPerEm );\r
 777                                                 bottom = new klass( props[ 2 ], getValue( _2 ), getUnit( _2 ), pxPerEm );\r
 778                                                 break;\r
 779                                         case 4 :\r
 780                                                 top    = new klass( props[ 0 ], v, u, pxPerEm );\r
 781                                                 right  = new klass( props[ 1 ], getValue( _1 ), getUnit( _1 ), pxPerEm );\r
 782                                                 bottom = new klass( props[ 2 ], getValue( _2 ), getUnit( _2 ), pxPerEm );\r
 783                                                 left   = new klass( props[ 3 ], getValue( _3 ), getUnit( _3 ), pxPerEm );\r
 784                                                 break;\r
 785                                 };\r
 786                                 return new FrexibleProperty( name, top, right, bottom, left );\r
 787                         },\r
 788                         getBorderColor: function( name ){\r
 789                                 var props    = 'borderTopColor,borderRightColor,borderBottomColor,borderLeftColor'.split( ',' ),\r
 790                                         top      = this.get( props[ 0 ] ),\r
 791                                         right    = this.get( props[ 1 ] ),\r
 792                                         bottom   = this.get( props[ 2 ] ),\r
 793                                         left     = this.get( props[ 3 ] ),\r
 794                                         ret      = new FrexibleProperty( name, top, right, bottom, left ),\r
 795                                         all, _0, _1, getColor;\r
 796                                 if( ret.isValid() === true ) return ret;\r
 797                                 ret.kill();\r
 798                                 getColor = this.getColor;\r
 799                                 all = this.style[ name ].split( ' ' );\r
 800                                 _0  = all[ 0 ];\r
 801                                 _1  = all[ 1 ];\r
 802                                 switch( all.length ){\r
 803                                         case 1 :\r
 804                                                 top    = getColor( _0, props[ 0 ] );\r
 805                                                 right  = getColor( _0, props[ 1 ] );\r
 806                                                 bottom = getColor( _0, props[ 2 ] );\r
 807                                                 left   = getColor( _0, props[ 3 ] );\r
 808                                                 break;\r
 809                                         case 2 :\r
 810                                                 top    = getColor( _0, props[ 0 ] );\r
 811                                                 right  = getColor( _1, props[ 1 ] );\r
 812                                                 bottom = getColor( _0, props[ 2 ] );\r
 813                                                 left   = getColor( _1, props[ 3 ] );\r
 814                                                 break;\r
 815                                         case 3 :\r
 816                                                 top    = getColor( _0,       props[ 0 ] );\r
 817                                                 right  = getColor( _1,       props[ 1 ] );\r
 818                                                 bottom = getColor( all[ 2 ], props[ 2 ] );\r
 819                                                 left   = getColor( _1,       props[ 3 ] );\r
 820                                                 break;\r
 821                                         case 4 :\r
 822                                                 top    = getColor( _0,       props[ 0 ] );\r
 823                                                 right  = getColor( _1,       props[ 1 ] );\r
 824                                                 bottom = getColor( all[ 2 ], props[ 2 ] );\r
 825                                                 left   = getColor( all[ 3 ], props[ 3 ] );\r
 826                                                 break;\r
 827                                 };\r
 828                                 return new FrexibleProperty( name, top, right, bottom, left );\r
 829                         }\r
 830                 }\r
 831         );\r
 832         function camelizeHash( obj ){\r
 833                 var p, _p, came = Util.camelize;\r
 834                 for( p in obj ){\r
 835                         _p = came( p );\r
 836                         if( _p === p ) continue;\r
 837                         obj[ _p ] = obj[ _p ] || obj[ p ];\r
 838                         delete obj[ p ];\r
 839                 };\r
 840         };      \r
 841         return {\r
 842                 create: function( css ){\r
 843                         return new WrappedStyle( camelizeHash( p ) );\r
 844                 }\r
 845         };\r
 846 })();\r
 847 \r
 848 var XDocument = ( function( window, document ){\r
 849         \r
 850         var getIndex  = Util.getIndex;\r
 851         var ROOT_LIST = [];\r
 852         var DEF_ATTRS = {};\r
 853         var AUTO      = Number.POSITIVE_INFINITY;\r
 854         var FULL      = DEF_ATTRS; // something unigue value;\r
 855         var FLOOR     = Math.floor;\r
 856         \r
 857         DEF_ATTRS.LENGTH            =  1;\r
 858         DEF_ATTRS.PERCENT           =  2;\r
 859         DEF_ATTRS.COLOR             =  4;\r
 860         DEF_ATTRS.U_DECIMAL         =  8;\r
 861         DEF_ATTRS.NUMERICAL         = 16;\r
 862         DEF_ATTRS.BOOLEAN           = 32;\r
 863         DEF_ATTRS.QUARTET           = 64;\r
 864         DEF_ATTRS.URL               = 128;\r
 865         DEF_ATTRS.FONT_NAME         = 256;\r
 866         DEF_ATTRS.LIST              = 512;\r
 867         DEF_ATTRS.AUTO              = 1024;\r
 868         DEF_ATTRS.COMBI             = 2048;\r
 869         DEF_ATTRS.BORDER_STYLE      = 'none,hidden,dotted,dashed,solid,double,groove,ridge,inset,outset'.split(',');\r
 870         DEF_ATTRS.POSITION_X        = 'left,center,right'.split(',');\r
 871         DEF_ATTRS.POSITION_Y        = 'top,center,bottom'.split(',');\r
 872         DEF_ATTRS.ALIGN             = 'left,center,right,justify'.split(',');\r
 873         DEF_ATTRS.TEXT_DECORATION   = 'none,underline,overline,line-through,blink'.split(',');\r
 874         DEF_ATTRS.TEXT_TRANSFORM    = 'none,capitalize,lowercase,uppercase'.split(',');\r
 875         DEF_ATTRS.WIDTH_HEIGHT      = 'auto'.split(',');\r
 876         DEF_ATTRS.BOX_SIZING        = 'content-box,padding-box,border-box,margin-box'.split(',');\r
 877         DEF_ATTRS.PAINT             = 1; // 再描画のみ必要\r
 878         DEF_ATTRS.REFLOW            = 2; // レイアウトの再計算が必要\r
 879         DEF_ATTRS.FONT              = 3; // フォントサイズが変更された\r
 880         DEF_ATTRS.CONTENT_UPDATE    = 4; // コンテンツが変更された\r
 881         \r
 882         DEF_ATTRS.borderWidth    = [ DEF_ATTRS.REFLOW,  0, DEF_ATTRS.QUARTET | DEF_ATTRS.LENGTH      ]; // em [ top, right, bottom, left ]\r
 883         DEF_ATTRS.borderColor    = [ DEF_ATTRS.PAINT,   4, DEF_ATTRS.QUARTET | DEF_ATTRS.DEF_COLOR   ]; // color [ top, right, bottom, left ]\r
 884         DEF_ATTRS.borderStyle    = [ DEF_ATTRS.PAINT,   8, DEF_ATTRS.QUARTET | DEF_ATTRS.LIST, DEF_ATTRS.BORDER_STYLE ]; // string [ top, right, bottom, left ]\r
 885         DEF_ATTRS.cornerRadius   = [ DEF_ATTRS.PAINT,  12, DEF_ATTRS.QUARTET | DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ]; // em, px [ top, right, bottom, left ]\r
 886         DEF_ATTRS.bgColor        = [ DEF_ATTRS.PAINT,  16, DEF_ATTRS.COLOR     ]; // color\r
 887         DEF_ATTRS.bgAlpha        = [ DEF_ATTRS.PAINT,  17, DEF_ATTRS.U_DECIMAL ]; // 0 - 1\r
 888         DEF_ATTRS.bgImgUrl       = [ DEF_ATTRS.PAINT,  18, DEF_ATTRS.URL       ]; // url\r
 889         DEF_ATTRS.bgImgRepeatX   = [ DEF_ATTRS.PAINT,  19, DEF_ATTRS.BOOLEAN   ]; // true / false\r
 890         DEF_ATTRS.bgImgRepeatY   = [ DEF_ATTRS.PAINT,  20, DEF_ATTRS.BOOLEAN   ]; // true / false\r
 891         DEF_ATTRS.bgImgPositionX = [ DEF_ATTRS.PAINT,  21, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT | DEF_ATTRS.LIST, DEF_ATTRS.POSITION_X ]; // em %, px, string\r
 892         DEF_ATTRS.bgImgPositionY = [ DEF_ATTRS.PAINT,  22, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT | DEF_ATTRS.LIST, DEF_ATTRS.POSITION_Y ]; // em %, px, string\r
 893         DEF_ATTRS.shadowColor    = [ DEF_ATTRS.PAINT,  23, DEF_ATTRS.COLOR     ]; // color\r
 894         DEF_ATTRS.shadowAlpha    = [ DEF_ATTRS.PAINT,  24, DEF_ATTRS.U_DECIMAL ]; // 0 - 1\r
 895         DEF_ATTRS.shadowOffsetX  = [ DEF_ATTRS.PAINT,  25, DEF_ATTRS.LENGTH    ]; // em\r
 896         DEF_ATTRS.shadowOffsetY  = [ DEF_ATTRS.PAINT,  26, DEF_ATTRS.LENGTH    ]; // em\r
 897         DEF_ATTRS.shadowBlur     = [ DEF_ATTRS.PAINT,  27, DEF_ATTRS.LENGTH    ]; // em\r
 898         DEF_ATTRS.shadowSpread   = [ DEF_ATTRS.PAINT,  28, DEF_ATTRS.LENGTH    ]; // em\r
 899         DEF_ATTRS.shadowInset    = [ DEF_ATTRS.PAINT,  29, DEF_ATTRS.BOOLEAN   ]; // true / false\r
 900         \r
 901         DEF_ATTRS.color          = [ DEF_ATTRS.PAINT,  30, DEF_ATTRS.COLOR     ]; // color\r
 902         DEF_ATTRS.fontFamily     = [ DEF_ATTRS.FONT,   31, DEF_ATTRS.FONT_NAME ]; // string\r
 903         DEF_ATTRS.fontSize       = [ DEF_ATTRS.FONT,   32, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ]; // em, %\r
 904         DEF_ATTRS.bold           = [ DEF_ATTRS.FONT,   33, DEF_ATTRS.BOOLEAN   ]; // true / false\r
 905         DEF_ATTRS.italic         = [ DEF_ATTRS.FONT,   34, DEF_ATTRS.BOOLEAN   ]; // true / false\r
 906         DEF_ATTRS.lineHeight     = [ DEF_ATTRS.FONT,   35, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT | DEF_ATTRS.NUMERICAL ]; // em, %, \r
 907         DEF_ATTRS.letterSpacing  = [ DEF_ATTRS.FONT,   36, DEF_ATTRS.LENGTH    ]; // em\r
 908         DEF_ATTRS.wordSpacing    = [ DEF_ATTRS.FONT,   37, DEF_ATTRS.LENGTH    ];\r
 909         DEF_ATTRS.align          = [ DEF_ATTRS.FONT,   38, DEF_ATTRS.LIST, DEF_ATTRS.ALIGN           ];\r
 910         DEF_ATTRS.decoration     = [ DEF_ATTRS.PAINT,  39, DEF_ATTRS.LIST, DEF_ATTRS.TEXT_DECORATION ];\r
 911         DEF_ATTRS.transform      = [ DEF_ATTRS.FONT,   40, DEF_ATTRS.LIST, DEF_ATTRS.TEXT_TRANSFORM  ];\r
 912         DEF_ATTRS.textShadowColor   = [ DEF_ATTRS.PAINT,  41, DEF_ATTRS.COLOR     ];\r
 913         DEF_ATTRS.textShadowOffsetX = [ DEF_ATTRS.PAINT,  42, DEF_ATTRS.LENGTH    ];\r
 914         DEF_ATTRS.textShadowOffsetY = [ DEF_ATTRS.PAINT,  43, DEF_ATTRS.LENGTH    ];\r
 915         DEF_ATTRS.shadowBlur     = [ DEF_ATTRS.PAINT,  44, DEF_ATTRS.LENGTH    ];\r
 916         \r
 917         DEF_ATTRS.width              = [ DEF_ATTRS.REFLOW, 45, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT, DEF_ATTRS.WIDTH_HEIGHT ];\r
 918         DEF_ATTRS.minWidth           = [ DEF_ATTRS.REFLOW, 46, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 919         DEF_ATTRS.maxWidth           = [ DEF_ATTRS.REFLOW, 47, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 920         DEF_ATTRS.height             = [ DEF_ATTRS.REFLOW, 48, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT, DEF_ATTRS.WIDTH_HEIGHT ];\r
 921         DEF_ATTRS.minHeight          = [ DEF_ATTRS.REFLOW, 49, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 922         DEF_ATTRS.maxHeight          = [ DEF_ATTRS.REFLOW, 50, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 923         DEF_ATTRS.padding            = [ DEF_ATTRS.REFLOW, 51, DEF_ATTRS.QUARTET | DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 924         DEF_ATTRS.margin             = [ DEF_ATTRS.REFLOW, 55, DEF_ATTRS.QUARTET | DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 925         DEF_ATTRS.sizing             = [ DEF_ATTRS.REFLOW, 59, DEF_ATTRS.LIST, DEF_ATTRS.BOX_SIZING ];\r
 926         DEF_ATTRS.pageBox            = [ DEF_ATTRS.REFLOW, 60, DEF_ATTRS.BOOLEAN   ]; // true / false\r
 927         DEF_ATTRS.x = DEF_ATTRS.left = [ DEF_ATTRS.REFLOW, 61, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 928         DEF_ATTRS.y = DEF_ATTRS.top  = [ DEF_ATTRS.REFLOW, 62, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 929         DEF_ATTRS.bottom             = [ DEF_ATTRS.REFLOW, 63, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 930         DEF_ATTRS.right              = [ DEF_ATTRS.REFLOW, 64, DEF_ATTRS.LENGTH | DEF_ATTRS.PERCENT ];\r
 931         \r
 932         var ATTRS = ( function(){\r
 933                 var ret = {},\r
 934                         obj = DEF_ATTRS,\r
 935                         p;\r
 936                 for( p in obj ){\r
 937                         if( Type.isArray( obj[ p ] ) === true ){\r
 938                                 ret[ p ] = obj[ p ][ 1 ];\r
 939                         };\r
 940                 };\r
 941                 return ret;\r
 942         })();\r
 943         \r
 944         /**\r
 945          * 再計算と再描画\r
 946          * redraw 再描画はパラメータ変更後に setTimeout で\r
 947          * reflow 再計算は値が get された場合 invalidate が サイズだったら\r
 948          * または再描画前に invalidate がサイズなフラグが足っていたら \r
 949          */\r
 950         \r
 951         var BasicLayoutManager = Class.create(\r
 952                 'BasicLayoutManager',\r
 953                 Class.POOL_OBJECT,\r
 954                 {\r
 955                         Constructor : function(){\r
 956                                 \r
 957                         },\r
 958                         redraw : function( nodeData ){\r
 959                                 var root = nodeData.__root;\r
 960                                 root.dirty === DEF_ATTRS.REFLOW && this.reflow( root );\r
 961                                 \r
 962                                 // draw\r
 963                         },\r
 964                         reflow : function( nodeData, allowW, allowH ){\r
 965                                 nodeData.preMesure( allowW, allowH );\r
 966                                 \r
 967                                 var children = nodeData.children,                               \r
 968                                         contentW = nodeData.contentWidth,\r
 969                                         contentH = nodeData.contentHeight,\r
 970                                         autoW    = contentW === AUTO,\r
 971                                         autoH    = contentH === AUTO,\r
 972                                         auto, calc, childW, childH, child, i, style, data,\r
 973                                         t, r, b, l;                     \r
 974                                 if( children ){\r
 975                                         auto     = autoW && autoH;\r
 976                                         childW   = 0;\r
 977                                         childH   = 0;\r
 978                                         calc     = BasicLayoutManager.calcValue;                        \r
 979                                         for( i = children.length; i; ){\r
 980                                                 child = children[ --i ];\r
 981                                                 style = child.__style;\r
 982                                                 if( style ){\r
 983                                                         data = style.data;\r
 984                                                         t = calc( data[ ATTRS.top ],    contentH );\r
 985                                                         r = calc( data[ ATTRS.right ],  contentW );\r
 986                                                         b = calc( data[ ATTRS.bottom ], contentH );\r
 987                                                         l = calc( data[ ATTRS.left ],   contentW );\r
 988                                                 } else {\r
 989                                                         t = r = b = l = 0;\r
 990                                                 };\r
 991                                                 if( child instanceof LayoutBoxPrivate ){\r
 992                                                         child.layoutManager.reflow( child, contentW - r - l, contentH - t - b );\r
 993                                                 } else {\r
 994                                                         child.preMesure( contentW - r - l, contentH - t - b );\r
 995                                                         child.mesure();\r
 996                                                         child.postMesure();\r
 997                                                 };\r
 998                                                 if( !auto ) continue;\r
 999                                                 if( autoW && childW < child.boxWidth  + r + l ) childW = child.boxWidth  + r + l;\r
1000                                                 if( autoH && childH < child.boxHeight + t + b ) childH = child.boxHeight + t + b;                                               \r
1001                                         };\r
1002                                         if( autoW )     nodeData.contentWidth  = childW;\r
1003                                         if( autoH ) nodeData.contentHeight = childH;\r
1004                                 };\r
1005                                 ( autoW || autoH ) && nodeData.postMesure();\r
1006                                 \r
1007                                 delete nodeData.dirty;\r
1008                         }\r
1009                 }\r
1010         );\r
1011         BasicLayoutManager.finalValue = function( styleValue, styleMin, styleMax, srcValue ){\r
1012                 var calc = BasicLayoutManager.calcValue,\r
1013                         v    = calc( styleValue, srcValue ),\r
1014                         min  = calc( styleMin,   srcValue ),\r
1015                         max  = calc( styleMax,   srcValue );\r
1016                 if( v < min ) return min;\r
1017                 if( max < v ) return max;\r
1018                 return v;\r
1019         };\r
1020         BasicLayoutManager.calcValue = function( styleValue, srcValue ){\r
1021                 switch( styleValue ){\r
1022                         case 0 :\r
1023                                 return 0;\r
1024                         case AUTO :\r
1025                                 return AUTO;\r
1026                         case FULL :\r
1027                                 return srcValue; // 100%\r
1028                         default :\r
1029                                 if( 1 <= styleValue ) return styleValue; // legth\r
1030                                 if( -1 < styleValue ) return FLOOR( srcValue * styleValue ); // %\r
1031                 };\r
1032                 return styleValue; // - length\r
1033         };\r
1034         BasicLayoutManager.advancedCalcValue = function( styleValue, srcValue ){\r
1035                 switch( styleValue ){\r
1036                         case 0 :\r
1037                                 return 0;\r
1038                         case AUTO :\r
1039                                 return srcValue;\r
1040                         case FULL :\r
1041                                 throw new Error( 'advancedCalcValue FULL' ); \r
1042                                 // return ; // 100%\r
1043                         default :\r
1044                                 if( 1 <= styleValue ) return styleValue; \r
1045                                 if( -1 < styleValue ) return FLOOR( ( srcValue / ( 1 - styleValue ) ) * styleValue ); // %\r
1046                 };\r
1047                 return styleValue; // - length\r
1048         };\r
1049         \r
1050         var NodeStylePrivate = Class.create(\r
1051                 Class.PRIVATE_DATA | Class.POOL_OBJECT,\r
1052                 {\r
1053                         fontCssText   : null,\r
1054                         colorCssText  : null,\r
1055                         layoutCssText : null,\r
1056                         Constructor : function(){\r
1057                                 this.data  = [];\r
1058                                 this.dirty = 0;\r
1059                         },\r
1060                         register : function( node ){\r
1061                                 var root  = node.__root,\r
1062                                         roots = this.rootList,\r
1063                                         nodes = this.nodeList;\r
1064                                 if( !roots ){\r
1065                                         this.rootList = [ root ];\r
1066                                 } else\r
1067                                 if( getIndex( roots, root ) === -1 ) roots[ roots.length ] = root;\r
1068                                 \r
1069                                 if( !nodes ){\r
1070                                         this.nodeList = [ node ];\r
1071                                         return;\r
1072                                 };\r
1073                                 if( getIndex( nodes, node ) === -1 ) nodes[ nodes.length ] = node;\r
1074                         },\r
1075                         unRegister : function( node ){\r
1076                                 var nodes = this.nodeList,\r
1077                                         i     = getIndex( nodes, node ),\r
1078                                         root  = node._root,\r
1079                                         roots = this.rootList,\r
1080                                         j     = getIndex( roots, root );\r
1081                                 if( i !== -1 && nodes.splice( i, 1 ) && nodes.length === 0 ) delete this.nodeList;\r
1082                                 if( j !== -1 && roots.splice( j, 1 ) && roots.length === 0 ) delete this.rootList;\r
1083                         },\r
1084                         clone : function(){\r
1085                                 var styleClass = Class.getClass( this.User ),\r
1086                                         dataClass  = Class.getClass( this );\r
1087                         },\r
1088                         /*\r
1089                          * opt_unit は getter のみ\r
1090                          */\r
1091                         attr : function( prop, v, opt_unit ){\r
1092                                 var update    = prop[ 0 ],\r
1093                                         propID    = prop[ 1 ],\r
1094                                         type      = prop[ 2 ],\r
1095                                         list      = prop[ 3 ],\r
1096                                         length    = !!( type & DEF_ATTRS.LENGTH    ),\r
1097                                         percent   = !!( type & DEF_ATTRS.PERCENT   ),\r
1098                                         color     = !!( type & DEF_ATTRS.COLOR     ),\r
1099                                         uDecimal  = !!( type & DEF_ATTRS.U_DECIMAL ),\r
1100                                         numerical = !!( type & DEF_ATTRS.NUMERICAL ),\r
1101                                         flag      = !!( type & DEF_ATTRS.BOOLEAN   ),\r
1102                                         quartet   = !!( type & DEF_ATTRS.QUARTET   ),\r
1103                                         url       = !!( type & DEF_ATTRS.URL       ),\r
1104                                         fontName  = !!( type & DEF_ATTRS.FONT_NAME ),\r
1105                                         //list      = !!( type & DEF_ATTRS.LIST      ),\r
1106                                         combi     = !!( type & DEF_ATTRS.COMBI     ),\r
1107                                         data      = this.data,\r
1108                                         _v        = -1,\r
1109                                         i, l, nodes, root;\r
1110                                 /*\r
1111                                  * Setter\r
1112                                  */\r
1113                                 if( v !== undefined ){\r
1114                                         if( Type.isNumber( v ) === true ){\r
1115                                                 if( numerical === false ){\r
1116                                                         if( uDecimal === false || v < 0 || 1 < v ) throw new Error( '' );\r
1117                                                 };\r
1118                                         } else\r
1119                                         if( Type.isBoolean( v ) === true ){\r
1120                                                 if( flag === false ) throw new Error( '' );\r
1121                                         } else\r
1122                                         if( Type.isString( v ) === true ){\r
1123                                                 if( url === false && fontName === false ){\r
1124                                                         if( v.indexOf( ' ' ) !== -1 ){\r
1125                                                                 v = v.split( ' ' );\r
1126                                                         } else {\r
1127                                                                 if( length === false && percent === false && color === false ) throw new Error( '' );\r
1128                                                         };\r
1129                                                 };\r
1130                                         };                                      \r
1131                                         if( Type.isArray( v ) === true ){\r
1132                                                 if( v.length <= 4 && quartet === true ){\r
1133                                                         type ^= DEF_ATTRS.QUARTET;\r
1134                                                 } else\r
1135                                                 if( v.length === 2 && combi === true ){\r
1136                                                         type ^= DEF_ATTRS.COMBI;\r
1137                                                 } else {\r
1138                                                         throw new Error( '' );\r
1139                                                 };\r
1140                                                 switch( v.length ){\r
1141                                                         case 1 :\r
1142                                                                 this.attr( [ propID  , type, list ], v[ 0 ] );\r
1143                                                                 this.attr( [ ++propID, type, list ], v[ 0 ] );\r
1144                                                                 this.attr( [ ++propID, type, list ], v[ 0 ] );\r
1145                                                                 this.attr( [ ++propID, type, list ], v[ 0 ] );\r
1146                                                                 break;\r
1147                                                         case 2 :\r
1148                                                                 this.attr( [ propID  , type, list ], v[ 0 ] );\r
1149                                                                 this.attr( [ ++propID, type, list ], v[ 1 ] );\r
1150                                                                 this.attr( [ ++propID, type, list ], v[ 0 ] );\r
1151                                                                 this.attr( [ ++propID, type, list ], v[ 1 ] );\r
1152                                                                 break;\r
1153                                                         case 3 :\r
1154                                                                 this.attr( [ propID  , type, list ], v[ 0 ] );\r
1155                                                                 this.attr( [ ++propID, type, list ], v[ 1 ] );\r
1156                                                                 this.attr( [ ++propID, type, list ], v[ 2 ] );\r
1157                                                                 this.attr( [ ++propID, type, list ], v[ 1 ] );\r
1158                                                                 break;\r
1159                                                         case 4 :\r
1160                                                                 this.attr( [ propID  , type, list ], v[ 0 ] );\r
1161                                                                 this.attr( [ ++propID, type, list ], v[ 1 ] );\r
1162                                                                 this.attr( [ ++propID, type, list ], v[ 2 ] );\r
1163                                                                 this.attr( [ ++propID, type, list ], v[ 3 ] );\r
1164                                                                 break;\r
1165                                                         default :\r
1166                                                 };\r
1167                                                 return this.User;\r
1168                                         };\r
1169                                         switch( update ){\r
1170                                                 case DEF_ATTRS.REFLOW :\r
1171                                                         delete this.layoutCssText;\r
1172                                                         break;\r
1173                                                 case DEF_ATTRS.PAINT :\r
1174                                                         delete this.colorCssText;\r
1175                                                         break;\r
1176                                                 case DEF_ATTRS.FONT :\r
1177                                                         delete this.fontCssText;\r
1178                                         };\r
1179 \r
1180                                         if( this.dirty < update ){\r
1181                                                 this.dirty = update;\r
1182                                                 roots = this.rootList;\r
1183                                                 for( i = 0, l = roots.length; i < l; ++i ){\r
1184                                                         root = roots[ i ];\r
1185                                                         if( root.dirty < update ) root.dirty = update;\r
1186                                                 };\r
1187                                         };\r
1188                                         \r
1189                                         if( list ) _v = Util.getIndex( list, v );\r
1190                                         data[ propID ] = _v !== -1 ? _v : v;\r
1191                                         \r
1192                                         switch( prop ){\r
1193                                                 case DEF_ATTRS.left  :\r
1194                                                 case DEF_ATTRS.right :\r
1195                                                         this.ltrtWidth = data[ DEF_ATTRS.left[ 0 ] ] === undefined && data[ DEF_ATTRS.right[ 0 ] ] === undefined;\r
1196                                                         break;\r
1197                                                 case DEF_ATTRS.top    :\r
1198                                                 case DEF_ATTRS.bottom :\r
1199                                                         this.tpbtHeight = data[ DEF_ATTRS.top[ 0 ] ] === undefined && data[ DEF_ATTRS.bottom[ 0 ] ] === undefined;\r
1200                                                         break;\r
1201                                                 case DEF_ATTRS.width :\r
1202                                                         this.autoWidth = v === AUTO;\r
1203                                                         this.prctWidth = v === FULL || v < 1;\r
1204                                                         break;\r
1205                                                 case DEF_ATTRS.height :\r
1206                                                         this.autoHeight = v === AUTO;\r
1207                                                         this.prctHeight   = v === FULL || v < 1;\r
1208                                                         break;\r
1209                                         };                                      \r
1210                                         return this.User;\r
1211                                 };\r
1212                                 v = data[ propID ];\r
1213                                 // Unit\r
1214                                 if( quartet === true ) return [ v, data[ ++propID ], data[ ++propID ], data[ ++propID ] ];\r
1215                                 if( combi === true ) return [ v, data[ ++propID ] ];\r
1216                                 if( list && Type.isNumber( v ) === true ) return list[ v ];\r
1217                                 return v;\r
1218                         },\r
1219                         cssText : function(){\r
1220                                 if( this.fontCssText   === null ) this.fontCssText   = this.createFontCssText();\r
1221                                 if( this.layoutCssText === null ) this.layoutCssText = this.createLayoutCssText();\r
1222                                 if( this.colorCssText  === null ) this.colorCssText  = this.createColorCssText();\r
1223                                 return [ this.fontCssText, this.colorCssText, this.layoutCssText ].join( ';' );\r
1224                         },\r
1225                         createFontCssText : function(){\r
1226                                 var data = this.data,\r
1227                                         css  = [],\r
1228                                         v;\r
1229                                 if( v = data[ ATTRS.fontFamily    ] ) css[ 0 ] = 'font-family:' + v;\r
1230                                 if( v = data[ ATTRS.fontSize      ] ) css[ css.length - 1 ] = 'font-size:' + v;\r
1231                                 if( v = data[ ATTRS.bold          ] ) css[ css.length - 1 ] = 'font-weight:bold';\r
1232                                 if( v = data[ ATTRS.bold          ] ) css[ css.length - 1 ] = 'font-style:italic';\r
1233                                 if( v = data[ ATTRS.lineHeight    ] ) css[ css.length - 1 ] = 'line-height:' + v;\r
1234                                 if( v = data[ ATTRS.letterSpacing ] ) css[ css.length - 1 ] = 'letter-spacing:' + v;\r
1235                                 if( v = data[ ATTRS.wordSpacing   ] ) css[ css.length - 1 ] = 'word-spacing:' + v;\r
1236                                 if( v = data[ ATTRS.align         ] ) css[ css.length - 1 ] = 'text-align:' + DEF_ATTRS.ALIGN[ v ];\r
1237                                 if( v = data[ ATTRS.transform     ] ) css[ css.length - 1 ] = 'text-transform:' + DEF_ATTRS.TEXT_TRANSFORM[ v ];\r
1238                                 return css.join( ',' );\r
1239                         },\r
1240                         createColorCssText : function(){\r
1241                                 var data = this.data,\r
1242                                         css  = [],\r
1243                                         v, x, y, c, b;\r
1244                                 if( v = data[ ATTRS.borderColor ]      ) css[ 0 ] = 'border-color:' + v;\r
1245                                 if( v = data[ ATTRS.borderStyle + 0 ]  ) css[ css.length - 1 ] = 'border-top-style:' + DEF_ATTRS.BORDER_STYLE[ v ];\r
1246                                 if( v = data[ ATTRS.borderStyle + 1 ]  ) css[ css.length - 1 ] = 'border-right-style:' + DEF_ATTRS.BORDER_STYLE[ v ];\r
1247                                 if( v = data[ ATTRS.borderStyle + 2 ]  ) css[ css.length - 1 ] = 'border-bottom-style:' + DEF_ATTRS.BORDER_STYLE[ v ];\r
1248                                 if( v = data[ ATTRS.borderStyle + 3 ]  ) css[ css.length - 1 ] = 'border-left-style:' + DEF_ATTRS.BORDER_STYLE[ v ];\r
1249                                 if( v = data[ ATTRS.cornerRadius + 0 ] ) css[ css.length - 1 ] = 'corner-radius-top:' + v;\r
1250                                 if( v = data[ ATTRS.cornerRadius + 1 ] ) css[ css.length - 1 ] = 'corner-radius-right:' + v;\r
1251                                 if( v = data[ ATTRS.cornerRadius + 2 ] ) css[ css.length - 1 ] = 'border-radius-bottom:' + v;\r
1252                                 if( v = data[ ATTRS.cornerRadius + 3 ] ) css[ css.length - 1 ] = 'border-radius-left:' + v;\r
1253                                 if( v = data[ ATTRS.bgColor          ] ) css[ css.length - 1 ] = 'background-color:' + v;\r
1254                                 // ATTRS.bgAlpha\r
1255                                 if( v = data[ ATTRS.bgImgUrl         ] ) css[ css.length - 1 ] = 'background-image:url(' + v + ')';\r
1256                                 x = data[ ATTRS.bgImgRepeatX ];\r
1257                                 y = data[ ATTRS.bgImgRepeatY ];\r
1258                                 if( x && y ){\r
1259                                         css[ css.length - 1 ] = 'background-repeat:repeat';\r
1260                                 } else\r
1261                                 if( x ){\r
1262                                         css[ css.length - 1 ] = 'background-repeat:repeat-x';\r
1263                                 } else \r
1264                                 if( y ){\r
1265                                         css[ css.length - 1 ] = 'background-repeat:repeat-y';\r
1266                                 };\r
1267                                 x = data[ ATTRS.bgImgPositionX ];\r
1268                                 y = data[ ATTRS.bgImgPositionY ];\r
1269                                 if( x && y ){\r
1270                                         css[ css.length - 1 ] = 'background-position:' + x + ' ' + y;\r
1271                                 } else\r
1272                                 if( x ){\r
1273                                         css[ css.length - 1 ] = 'background-position:' + x + ' 0';\r
1274                                 } else \r
1275                                 if( y ){\r
1276                                         css[ css.length - 1 ] = 'background-position:0 ' + y;\r
1277                                 };\r
1278                                 if( v = data[ ATTRS.color ]      ) css[ css.length - 1 ] = 'color:' + v;\r
1279                                 if( v = data[ ATTRS.decoration ] ) css[ css.length - 1 ] = 'text-decoration:' + DEF_ATTRS.TEXT_DECORATION[ v ];\r
1280                                 x = data[ ATTRS.textShadowOffsetX ];\r
1281                                 y = data[ ATTRS.textShadowOffsetY ];\r
1282                                 b = data[ ATTRS.textShadowBlur ];\r
1283                                 c = data[ ATTRS.textShadowColor ];\r
1284                                 if( c || x || y || b ){\r
1285                                         css[ css.length - 1 ] = 'text-shadow:' + x + ' ' + y + ' ' + b + ' ' + c;\r
1286                                 };\r
1287                                 /*\r
1288         ATTRS.shadowColor    = [ DEF_ATTRS.PAINT,  23, DEF_ATTRS.COLOR     ]; // color\r
1289         ATTRS.shadowAlpha    = [ DEF_ATTRS.PAINT,  24, DEF_ATTRS.U_DECIMAL ]; // 0 - 1\r
1290         ATTRS.shadowOffsetX  = [ DEF_ATTRS.PAINT,  25, DEF_ATTRS.LENGTH    ]; // em\r
1291         ATTRS.shadowOffsetY  = [ DEF_ATTRS.PAINT,  26, DEF_ATTRS.LENGTH    ]; // em\r
1292         ATTRS.shadowBlur     = [ DEF_ATTRS.PAINT,  27, DEF_ATTRS.LENGTH    ]; // em\r
1293         ATTRS.shadowSpread   = [ DEF_ATTRS.PAINT,  28, DEF_ATTRS.LENGTH    ]; // em\r
1294         ATTRS.shadowInset    = [ DEF_ATTRS.PAINT,  29, DEF_ATTRS.BOOLEAN   ]; // true / false\r
1295                                 */\r
1296                         },\r
1297                         createBoxShadowCssText : function(){\r
1298                                 \r
1299                         },\r
1300                         createBGAlphaCssText : function(){\r
1301                                 \r
1302                         },\r
1303                         createTextShadowCssText : function(){\r
1304                                 \r
1305                         },\r
1306                         createLayoutCssText : function(){\r
1307                                 \r
1308                         }\r
1309                 }\r
1310         );\r
1311         \r
1312         var NodeStyle = Class.create(\r
1313                 'NodeStyle',\r
1314                 Class.POOL_OBJECT,\r
1315                 NodeStylePrivate,\r
1316                 {\r
1317                         Constructor : function(){\r
1318                                 NodeStyle.newPrivateData( this );\r
1319                         },\r
1320                         borderWidth : function( v ){\r
1321                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.borderWidth, v );\r
1322                         },\r
1323                         borderColor : function(){\r
1324                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.borderColor, v );\r
1325                         },\r
1326                         borderStyle : function(){\r
1327                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.borderStyle, v );\r
1328                         },\r
1329                         cornerRadius : function(){\r
1330                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.cornerRadius, v );\r
1331                         },\r
1332                         bgColor : function(){\r
1333                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgColor, v );\r
1334                         },\r
1335                         bgAlpha : function(){\r
1336                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgAlpha, v );\r
1337                         },\r
1338                         bgImgUrl : function(){\r
1339                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgUrl, v );\r
1340                         },\r
1341                         bgImgRepeatX : function(){\r
1342                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgRepeatX, v );\r
1343                         },\r
1344                         bgImgRepeatY : function(){\r
1345                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgRepeatY, v );\r
1346                         },\r
1347                         bgImgPositionX : function(){\r
1348                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgPositionX, v );\r
1349                         },\r
1350                         bgImgPositionY : function(){\r
1351                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.bgImgPositionY, v );\r
1352                         },\r
1353                         shadowColor : function(){\r
1354                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowColor, v );\r
1355                         },\r
1356                         shadowAlpha : function(){\r
1357                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowAlpha, v );\r
1358                         },\r
1359                         shadowOffsetX : function(){\r
1360                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowOffsetX, v );\r
1361                         },\r
1362                         shadowOffsetY : function(){\r
1363                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowOffsetY, v );\r
1364                         },\r
1365                         shadowBlur : function(){\r
1366                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowBlur, v );\r
1367                         },\r
1368                         shadowSpread : function(){\r
1369                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowSpread, v );\r
1370                         },\r
1371                         shadowInset : function(){\r
1372                                 return NodeStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowInset, v );\r
1373                         },\r
1374                         color : function( v ){\r
1375                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.color, v );\r
1376                         },\r
1377                         fontFamily : function( v ){\r
1378                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.fontFamily, v );\r
1379                         },\r
1380                         fontSize : function( v ){\r
1381                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.fontSize, v );\r
1382                         },\r
1383                         bold : function( v ){\r
1384                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.bold, v );\r
1385                         },\r
1386                         italic : function( v ){\r
1387                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.italic, v );\r
1388                         },\r
1389                         lineHeight : function( v ){\r
1390                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.lineHeight, v );\r
1391                         },\r
1392                         letterSpacing : function( v ){\r
1393                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.letterSpacing, v );\r
1394                         },\r
1395                         wordSpacing : function( v ){\r
1396                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.wordSpacing, v );\r
1397                         },\r
1398                         align : function( v ){\r
1399                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.align, v );\r
1400                         },\r
1401                         decoration : function( v ){\r
1402                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.decoration, v );\r
1403                         },\r
1404                         transform : function( v ){\r
1405                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.transform, v );\r
1406                         },\r
1407                         textShadowColor : function( v ){\r
1408                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.textShadowColor, v );\r
1409                         },\r
1410                         textShadowOffsetX : function( v ){\r
1411                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.textShadowOffsetX, v );\r
1412                         },\r
1413                         textShadowOffsetY : function( v ){\r
1414                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.textShadowOffsetY, v );\r
1415                         },\r
1416                         shadowBlur : function( v ){\r
1417                                 return TypoStyle.getPrivateData( this ).attr( DEF_ATTRS.shadowBlur, v );\r
1418                         },\r
1419                         cssText : function(){\r
1420                                 return TypoStyle.getPrivateData( this ).cssText();\r
1421                         }\r
1422                 }\r
1423         );\r
1424 \r
1425         var NodePrivate = Class.create(\r
1426                 'NodePrivate',\r
1427                 Class.PRIVATE_DATA | Class.POOL_OBJECT,\r
1428                 {\r
1429                         elmWrap           : null,\r
1430                         elmExtend         : null,\r
1431                         textNode          : null,\r
1432                         boxX              : 0,\r
1433                         boxY              : 0,\r
1434                         boxWidth          : 0,\r
1435                         boxHeight         : 0,\r
1436                         contentL          : 0,\r
1437                         contentT          : 0,\r
1438                         contentR          : 0,\r
1439                         contentB          : 0,\r
1440                         borderL           : 0,\r
1441                         borderT           : 0,\r
1442                         borderR           : 0,\r
1443                         borderB           : 0,\r
1444                         paddingL          : 0,\r
1445                         paddingT          : 0,\r
1446                         paddingR          : 0,\r
1447                         paddingB          : 0,\r
1448                         marginL           : 0,\r
1449                         marginT           : 0,\r
1450                         marginR           : 0,\r
1451                         marginB           : 0,\r
1452                         boxSizingOffsetLR : 0,\r
1453                         boxSizingOffsetTB : 0,          \r
1454                         contentWidth      : 0,\r
1455                         minContentWidth   : 0,\r
1456                         maxContentWidth   : AUTO,\r
1457                         contentHeight     : 0,\r
1458                         minContentHeight  : 0,\r
1459                         maxContentHeight  : AUTO,\r
1460                         Constructor   : function( __root, __parent ){\r
1461                                 this.__root   = __root;\r
1462                                 if( __parent ) this.__parent = __parent;\r
1463                         },\r
1464                         style : function( v ){\r
1465                                 if( v instanceof NodeStyle ){\r
1466                                         if( v !== this._style ){\r
1467                                                 this.__style && this.__style.unRegister( this );\r
1468                                                 this._style = v;\r
1469                                                 this.__style = StylePrivate.getPrivateData( v );                                        \r
1470                                                 this.__style.register( this );                                          \r
1471                                         };\r
1472                                         return this.User;\r
1473                                 } else\r
1474                                 if( v === null ){\r
1475                                         this.__style && this.__style.unRegister( this );\r
1476                                         delete this._style;\r
1477                                         delete this.__style;\r
1478                                         return this.User;\r
1479                                 };\r
1480                                 return this._style;\r
1481                         },\r
1482                         content : function( v ){\r
1483                                 if( Type.isString( v ) === true ){\r
1484                                         if( !this.textNode || ( this.textNode && this.textNode.data !== v ) ){\r
1485                                                 this._content = v;\r
1486                                                 this.updateContent = true;\r
1487                                         };\r
1488                                         return this.User;\r
1489                                 } else\r
1490                                 if( v === null ){\r
1491                                         if( this._content !== v && this.textNode ){\r
1492                                                 this._content = v;\r
1493                                                 this.updateContent = true;\r
1494                                         };\r
1495                                         return this.User;\r
1496                                 };\r
1497                                 if( this._content ) return this._content;\r
1498                                 if( this._content === null ) return null;\r
1499                                 if( this.textNode ) return this.textNode.data;\r
1500                                 return null;\r
1501                         },\r
1502                         /**\r
1503                          * 要素の追加・削除\r
1504                          * 1. ペイントがある // 予約のみ\r
1505                          * 2. コンテンツがある // 予約のみ *\r
1506                          * 3. コンテンツを削除 // 予約のみ\r
1507                          * 4. 要素を削除 // 予約のみ\r
1508                          * \r
1509                          * コンテンツの再計算\r
1510                          * 0. 要素追加して css セット\r
1511                          * 1. コンテンツの変更\r
1512                          * 2. font 指定の変更\r
1513                          * 3. contentWidth の変更 （コンテンツの高さの再計算） 前回の contentWidth の保持\r
1514                          * \r
1515                          * contentSize, scrollSize の決定\r
1516                          */\r
1517                         musure : function( dirty ){\r
1518                                 var content = this._content,\r
1519                                         root    = this.__root,\r
1520                                         style   = this.__style,\r
1521                                         w       = this.contentWidth,\r
1522                                         h       = this.contentHeight;\r
1523                                 switch( this.updateContent === true ? DEF_ATTRS.CONTENT_UPDATE : dirty ){\r
1524                                         case DEF_ATTRS.CONTENT_UPDATE : // コンテンツが変更された\r
1525                                                 this.paint( 0 );\r
1526                                                 this.lastContentWidth = -1;\r
1527                                         case DEF_ATTRS.FONT   : // フォントサイズが変更された\r
1528                                         case DEF_ATTRS.REFLOW : // レイアウトの再計算が必要\r
1529                                                 /* http://web-designs.seesaa.net/article/188400668.html\r
1530                                                  * min-width の値が max-width の値より大きい場合は、max-width の値は min-width の値に設定される。\r
1531                                                  * \r
1532                                                  * テキストノードがあり\r
1533                                                  * 1. contentWidth === AUTO\r
1534                                                  *     style を更新して contentWidth の決定\r
1535                                                  *     min or max に引っかかったら style 更新\r
1536                                                  *     contentHeight === AUTO の場合\r
1537                                                  *     textHeight の決定\r
1538                                                  *     contentHeight !== AUTO の場合 scrollHeight のみ更新\r
1539                                                  * 2. contentHeight === AUTO かつ \r
1540                                                  *     コンテンツの高さの再取得が必要( contentWidth が最終計測時の contentWidth と一致 かつ フォント・コンテンツに変更無し の場合再取得不要)\r
1541                                                  *      style を更新して contentHeight の決定\r
1542                                                  *     必要でない\r
1543                                                  * 3. content のサイズがすでに決定している\r
1544                                                  *     コンテンツの高さの再取得が必要\r
1545                                                  *     必要でない\r
1546                                                  */   \r
1547                                                 if( this.textNode ){\r
1548                                                         if( w === AUTO ){\r
1549                                                                 this.commitStyle();\r
1550                                                                 w = this.contentWidth = this.textNode.offsetWidth;\r
1551                                                                 this.scrollWidth = w + this.contentL + this.contentR;\r
1552                                                                 if( this.maxContentWidth < w - this.boxSizingOffsetLR ) this.contentWidth = this.maxContentWidth + this.boxSizingOffsetLR;\r
1553                                                                 if( w - this.boxSizingOffsetLR < this.minContentWidth ) this.contentWidth = this.minContentWidth + this.boxSizingOffsetLR;\r
1554                                                                 this.lastContentWidth = this.contentWidth;\r
1555                                                                 \r
1556                                                                 w !== this.contentWidth && this.commitStyle();\r
1557                                                                 \r
1558                                                                 if( h === AUTO ){\r
1559                                                                         h = this.conetntHeight = this.textNode.offsetHeight;\r
1560                                                                         this.scrollHeight = h + this.contentT + this.contentB;\r
1561                                                                         if( this.maxContentHeight < h - this.boxSizingOffsetTB ) this.contentHeight = this.maxContentHeight + this.boxSizingOffsetTB;\r
1562                                                                         if( h - this.boxSizingOffsetTB < this.minContentHeight ) this.contentHeight = this.minContentHeight + this.boxSizingOffsetTB;\r
1563                                                                 } else {\r
1564                                                                         this.scrollHeight = this.textNode.offsetHeight + this.contentT + this.contentB;\r
1565                                                                 };\r
1566                                                         } else\r
1567                                                         if( h === AUTO ){\r
1568                                                                 if( w !== this.lastContentWidth || dirty !== DEF_ATTRS.REFLOW ){\r
1569                                                                         this.commitStyle();\r
1570                                                                         this.lastContentWidth  = w;\r
1571                                                                         h = this.conetntHeight = this.textNode.offsetHeight;\r
1572                                                                         this.scrollWidth       = w + this.contentL + this.contentR;\r
1573                                                                         this.scrollHeight      = h + this.contentT + this.contentB;\r
1574                                                                         if( this.maxContentHeight < h - this.boxSizingOffsetTB ) this.contentHeight = this.maxContentHeight + this.boxSizingOffsetTB;\r
1575                                                                         if( h - this.boxSizingOffsetTB < this.minContentHeight ) this.contentHeight = this.minContentHeight + this.boxSizingOffsetTB;                                                           \r
1576                                                                 } else {\r
1577                                                                         this.scrollWidth  = w + this.contentL + this.contentR;\r
1578                                                                         this.scrollHeight = h + this.contentT + this.contentB;\r
1579                                                                         root.paintReserve( this );\r
1580                                                                 };\r
1581                                                         } else {\r
1582                                                                 if( dirty !== DEF_ATTRS.REFLOW ){\r
1583                                                                         this.commitStyle();\r
1584                                                                         this.scrollWidth  = this.textNode.offsetWidth  + this.contentL + this.contentR;\r
1585                                                                         this.scrollHeight = this.textNode.offsetHeight + this.contentT + this.contentB;\r
1586                                                                 } else {\r
1587                                                                         root.paintReserve( this );\r
1588                                                                         this.scrollWidth  = w + this.contentL + this.contentR;\r
1589                                                                         this.scrollHeight = h + this.contentT + this.contentB;\r
1590                                                                 };\r
1591                                                         };                                      \r
1592                                                 } else {\r
1593                                                         if( w === AUTO ) this.contentWidth  = w = 0 < this.minContentWidth  ? this.minContentWidth  : 0;\r
1594                                                         if( h === AUTO ) this.contentHeight = h = 0 < this.minContentHeight ? this.minContentHeight : 0;\r
1595                                                         this.scrollWidth  = w + this.contentL + this.contentR;\r
1596                                                         this.scrollHeight = h + this.contentT + this.contentB;\r
1597                                                         root.paintReserve( this );                                      \r
1598                                                 };\r
1599                                                 break;                  \r
1600                                         case DEF_ATTRS.PAINT : // 再描画のみ必要\r
1601                                                 root.paintReserve( this );\r
1602                                                 break;                                          \r
1603                                 };\r
1604                         },\r
1605                         paint : function( dirty ){\r
1606                                 var content = this._content,\r
1607                                         style   = this.__style;                         \r
1608                                 if( this.updateContent === true || ( style && style.hasPaint === true ) ){\r
1609                                         if( !this.elmWrap ){\r
1610                                                 this.elmWrap = DOM.createDiv();\r
1611                                                 this.__parent.addDisplayElement( this );\r
1612                                         };\r
1613                                         dirty !== 0 && this.commitStyle();                      \r
1614                                         if( this.updateContent === true ){\r
1615                                                 if( content !== null ){\r
1616                                                         if( !this.textNode ){\r
1617                                                                 this.textNode = DOM.cerateText();\r
1618                                                                 this.elmWrap.appendChild( this.textNode );\r
1619                                                         };\r
1620                                                         this.textNode.data = content;                                                   \r
1621                                                 } else\r
1622                                                 if( this.textNode ){\r
1623                                                         DOM.correct( this.textNode );\r
1624                                                         delete this.textNode;\r
1625                                                         delete this.contentWidth;\r
1626                                                         delete this.conetntHeight;\r
1627                                                         delete this.scrollWidth;                                                        \r
1628                                                         delete this.scrollHeight;\r
1629                                                 };                                      \r
1630                                         };\r
1631                                 } else\r
1632                                 if( this.elmWrap && content === null && ( !style || style.hasPaint === false ) ){\r
1633                                         this.__parent.removeDisplayElement( this );\r
1634                                         DOM.correct( this.elmWrap );\r
1635                                         delete this.contentWidth;\r
1636                                         delete this.conetntHeight;\r
1637                                 };\r
1638                         },\r
1639                         commitStyle : function(){\r
1640                                 var css;\r
1641                                 if( this.elmWrap ){\r
1642                                         css = this.__style ? this.__style.cssText( this ) : '';\r
1643                                         if( this.contentWidth  !== AUTO ) css += 'width:'  + this.contentWidth  + 'px';\r
1644                                         if( this.contentHeight !== AUTO ) css += 'height:' + this.contentHeight + 'px';\r
1645                                         this.elmWrap.style.cssText = css;\r
1646                                 };\r
1647                         },\r
1648                         /*\r
1649                          * 親の サイズを元に自身のサイズを計算していく\r
1650                          */\r
1651                         preMesure : function( allowW, allowH ){\r
1652                                 var style    = this.__style,\r
1653                                         styles, calc, box, min, max,\r
1654                                         contentW, contentH, allowSize, boxMinus,\r
1655                                         paddingT, paddingR, paddingB, paddingL,\r
1656                                         borderT, borderR, borderB, borderL,\r
1657                                         marginT, marginR, marginB, marginL;\r
1658 \r
1659                                 if( style ){\r
1660                                         styles   = style.data;\r
1661                                         calc     = BasicLayoutManager.calcValue;\r
1662                                         box      = styles[ ATTRS.sizing ];\r
1663                                         \r
1664                                         // Width\r
1665                                         // 自身が ltrtWidth の場合 親が AUTO ではない\r
1666                                         // 自身が ltrtWidth でない場合自身が  AUTO はなくかつ親 が AUTO の場合自身は % でない\r
1667                                         if( style.ltrtWidth ? allowW !== AUTO : !style.autoWidth && ( allowW !== AUTO || !style.prctWidth ) ){\r
1668                                                 if( style.ltrtWidth ){\r
1669                                                         contentW = allowW; // - calc( styles[ ATTRS.left ], allowW ) - calc( styles[ ATTRS.right ], allowW );\r
1670                                                 } else {\r
1671                                                         contentW = BasicLayoutManager.finalValue( styles[ ATTRS.width ], styles[ ATTRS.minWidth ], styles[ ATTRS.maxWidth ], allowW );                                  \r
1672                                                 };\r
1673                                                 paddingR = calc( styles[ ATTRS.padding + 1 ], allowW );\r
1674                                                 paddingL = calc( styles[ ATTRS.padding + 3 ], allowW );\r
1675                                                 borderR  = styles[ ATTRS.border + 1 ];\r
1676                                                 borderL  = styles[ ATTRS.margin + 3 ];\r
1677                                                 marginR  = calc( styles[ ATTRS.margin + 1 ], allowW );\r
1678                                                 marginL  = calc( styles[ ATTRS.margin + 3 ], allowW );\r
1679                                                 this.boxWidth = contentW;\r
1680                                                 boxMinus = 0;\r
1681                                                 switch( box ){\r
1682                                                         case 3 : // margin-box\r
1683                                                                  boxMinus = - marginR - marginL;\r
1684                                                         case 2 : // border-box\r
1685                                                                  boxMinus -= borderR + borderL;\r
1686                                                         case 1 : // padding-box\r
1687                                                                  boxMinus -= paddingR + paddingL;\r
1688                                                         // case 0 : // content-box\r
1689                                                 };\r
1690                                                 this.contentL     = marginL + borderL + paddingL;\r
1691                                                 this.contentR     = marginR + borderR + paddingR;               \r
1692                                                 this.contentWidth = contentW + boxMinus;\r
1693                                                 this.boxSizingOffsetLR = boxMinus;\r
1694                                         } else {\r
1695                                                 this.boxWidth = this.contentWidth = AUTO;\r
1696                                                 min = styles[ ATTRS.minWidth ];\r
1697                                                 max = styles[ ATTRS.maxWidth ];\r
1698                                                 this.minContentWidth = 1 <= min ? min : 0;\r
1699                                                 this.maxContentWidth = 1 <= max ? max : AUTO;\r
1700                                                 delete this.boxSizingOffsetLR;\r
1701                                         };\r
1702                                         \r
1703                                         // Height\r
1704                                         if( style.tpbtHeight ? allowH !== AUTO : !style.autoHeight && ( allowH !== AUTO || !style.prctHeight ) ){                                                                                               \r
1705                                                 if( style.tpbtHeight ){\r
1706                                                         contentH = allowH; // - calc( styles[ ATTRS.top ], allowH ) - calc( styles[ ATTRS.bottom ], allowH );\r
1707                                                 } else {\r
1708                                                         contentH = BasicLayoutManager.finalValue( styles[ ATTRS.height ], styles[ ATTRS.minHeight ], styles[ ATTRS.maxHeight ], allowH );\r
1709                                                 };\r
1710                                                 allowSize = styles[ ATTRS.pageBox ] === true ? allowH : allowW;\r
1711                                                 paddingT  = calc( styles[ ATTRS.padding + 0 ], allowSize );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
1712                                                 paddingB  = calc( styles[ ATTRS.padding + 2 ], allowSize );\r
1713                                                 borderT   = styles[ ATTRS.border + 0 ];\r
1714                                                 borderB   = styles[ ATTRS.border + 2 ];\r
1715                                                 marginT   = calc( styles[ ATTRS.margin + 0 ], allowSize );// marginTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
1716                                                 marginB   = calc( styles[ ATTRS.margin + 2 ], allowSize );\r
1717                                                 this.boxHeight = contentH;\r
1718                                                 boxMinus = 0;\r
1719                                                 switch( box ){\r
1720                                                         case 3 : // margin-box\r
1721                                                                  boxMinus = - marginT - marginR;\r
1722                                                         case 2 : // border-box\r
1723                                                                  boxMinus -= borderT + borderR;\r
1724                                                         case 1 : // padding-box\r
1725                                                                  boxMinus -= paddingT + paddingR;\r
1726                                                         // case 0 : // content-box\r
1727                                                 };                      \r
1728                                                 this.contentT      = marginT + borderT + paddingT;\r
1729                                                 this.conetntB      = marginB + borderB + paddingB;                      \r
1730                                                 this.contentHeight = contentH + boxMinus;\r
1731                                                 this.boxSizingOffsetTB = boxMinus;\r
1732                                         } else {\r
1733                                                 this.boxHeight = this.contentHeight = AUTO;\r
1734                                                 min = styles[ ATTRS.minHeight ];\r
1735                                                 max = styles[ ATTRS.maxHeight ];\r
1736                                                 this.minContentHeight = 1 <= min ? min : 0;\r
1737                                                 this.maxContentHeight = 1 <= max ? max : AUTO;\r
1738                                                 delete this.boxSizingOffsetTB;\r
1739                                         };\r
1740                                 } else {\r
1741                                         this.boxWidth  = this.contentWidth  = allowW;\r
1742                                         this.boxHeight = this.contentHeight = allowH;\r
1743                                         delete this.minContentHeight;\r
1744                                         delete this.maxContentHeight;\r
1745                                         delete this.contentL;\r
1746                                         delete this.contentT;\r
1747                                         delete this.contentR;\r
1748                                         delete this.contentB;\r
1749                                 };\r
1750                         },\r
1751                         /**\r
1752                          * 自身のコンテンツサイズを元に AUTO な width, height を確定していく\r
1753                          */\r
1754                         postMesure : function(){\r
1755                                 var style    = this.__style,\r
1756                                         styles, calc, box,\r
1757                                         contentW, contentH, w, h\r
1758                                         contentSize, contentPlus;\r
1759                                 if( style ){\r
1760                                         styles   = style.data;\r
1761                                         calc     = BasicLayoutManager.advancedCalcValue;\r
1762                                         contentW = this.contentWidth;\r
1763                                         box      = styles[ ATTRS.sizing ];\r
1764                                         \r
1765                                         // Width\r
1766                                         if( this.boxWidth === AUTO ){\r
1767                                                 paddingR = calc( styles[ ATTRS.padding + 1 ], contentW );                                       \r
1768                                                 paddingL = calc( styles[ ATTRS.padding + 3 ], contentW );                                       \r
1769                                                 borderR  = styles[ ATTRS.border + 1 ];                                  \r
1770                                                 borderL  = styles[ ATTRS.border + 3 ];                                  \r
1771                                                 marginR  = calc( styles[ ATTRS.margin + 1 ], contentW );\r
1772                                                 marginL  = calc( styles[ ATTRS.margin + 3 ], contentW );\r
1773                                                 contentPlus = 0;\r
1774                                                 switch( box ){\r
1775                                                         case 3 : // margin-box\r
1776                                                                  contentPlus  = ( marginR + marginL );\r
1777                                                         case 2 : // border-box\r
1778                                                                  contentPlus += ( borderR + borderL );\r
1779                                                         case 1 : // padding-box\r
1780                                                                  contentPlus += ( paddingR + paddingL );\r
1781                                                         // case 0 : // content-box\r
1782                                                 };\r
1783                                                 this.contentWidth = contentW;\r
1784                                                 contentW += contentPlus;\r
1785                                                 if( !style.ltrtWidth ){\r
1786                                                         min = styles[ ATTRS.minWidth ];\r
1787                                                         max = styles[ ATTRS.maxWidth ];\r
1788                                                         if( contentW < min && 1 <= min && contentPlus < min ){\r
1789                                                                 this.contentWidth = min - contentPlus;\r
1790                                                         } else\r
1791                                                         if( max < contentW && 1 <= max && contentPlus < max ){\r
1792                                                                 this.contentWidth = max - contentPlus;\r
1793                                                         };\r
1794                                                 };\r
1795                                                 this.contentL = marginL + borderL + paddingL;\r
1796                                                 this.contentR = marginR + borderR + paddingR;\r
1797                                                 this.boxWidth = this.contentWidth + this.contentL + this.contentR;\r
1798                                         };\r
1799                                         // Height\r
1800                                         if( this.boxHeight === AUTO ){\r
1801                                                 contentH    = this.contentHeight;\r
1802                                                 contentSize = styles[ ATTRS.pageBox ] === true ? contentH : contentW;\r
1803                                                 paddingT    = calc( styles[ ATTRS.padding + 0 ], contentSize );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
1804                                                 paddingB    = calc( styles[ ATTRS.padding + 2 ], contentSize );\r
1805                                                 borderT     = styles[ ATTRS.border + 0 ];\r
1806                                                 borderB     = styles[ ATTRS.border + 2 ];\r
1807                                                 marginT     = calc( styles[ ATTRS.margin + 0 ], contentSize );// marginTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
1808                                                 marginB     = calc( styles[ ATTRS.margin + 2 ], contentSize );\r
1809                                                 contentPlus = 0;\r
1810                                                 switch( box ){\r
1811                                                         case 3 : // margin-box\r
1812                                                                  contentPlus  = ( marginT + marginB );\r
1813                                                         case 2 : // border-box\r
1814                                                                  contentPlus += ( borderT + borderB );\r
1815                                                         case 1 : // padding-box\r
1816                                                                  contentPlus += ( paddingT + paddingB );\r
1817                                                         // case 0 : // content-box\r
1818                                                 };\r
1819                                                 this.contentHeight = contentH;\r
1820                                                 contentH += contentPlus;\r
1821                                                 if( !style.tpbtHeight ){\r
1822                                                         min = styles[ ATTRS.minHeight ];\r
1823                                                         max = styles[ ATTRS.maxHeight ];\r
1824                                                         if( contentH < min && 1 <= min && contentPlus < min ){\r
1825                                                                 this.contentHeight = min - contentPlus;\r
1826                                                         } else\r
1827                                                         if( max < contentH && 1 <= max && contentPlus < max ){\r
1828                                                                 this.contentHeight = max - contentPlus;\r
1829                                                         };\r
1830                                                 };\r
1831                                                 this.contentT  = marginT + borderT + paddingT;\r
1832                                                 this.contentB  = marginB + borderB + paddingB;                                          \r
1833                                                 this.boxHeight = this.contentHeight + this.contentT + this.contentB;\r
1834                                         };                              \r
1835                                 } else {\r
1836                                         this.boxWidth  = this.contentWidth;\r
1837                                         this.boxHeight = this.contentHeight;\r
1838                                         delete this.minContentHeight;\r
1839                                         delete this.maxContentHeight;\r
1840                                         delete this.contentL;\r
1841                                         delete this.contentT;\r
1842                                         delete this.contentR;\r
1843                                         delete this.contentB;\r
1844                                 };\r
1845                         },\r
1846                         addDisplayElement : function( nodeData ){\r
1847                                 // 描画更新リストに追加\r
1848                         },\r
1849                         removeDisplayElement : function( nodeData ){\r
1850                                 // 描画更新リストに追加\r
1851                                 DOM.correct( nodeData.elmWrap );\r
1852                                 delete nodeData.elmWrap;\r
1853                                 delete nodeData.textNode;\r
1854                                 delete nodeData.contentWidth;\r
1855                                 delete nodeData.conetntHeight;\r
1856                                 delete nodeData.currentWidth;\r
1857                                 delete nodeData.currentHeight;                  \r
1858                         }\r
1859                 }\r
1860         );\r
1861         var Node = Class.create(\r
1862                 'Node',\r
1863                 Class.POOL_OBJECT,\r
1864                 NodePrivate,\r
1865                 {\r
1866                         Constructor : function( root, parent ){\r
1867                                 Node.newPrivateData( this,  LayoutBox.getPrivateData( root ), parent ? LayoutBox.getPrivateData( parent ) : undefined, this );\r
1868                         },\r
1869                         content : function( v ){\r
1870                                 return Node.getPrivateData( this ).content( v );\r
1871                         },\r
1872                         style : function( v ){\r
1873                                 return Node.getPrivateData( this ).paint( v );\r
1874                         },\r
1875                         remove : function(){\r
1876                                 Node.getPrivateData( this ).remove();\r
1877                         },\r
1878                         nodeIndex : function( v ){\r
1879                                 return Node.getPrivateData( this ).nodeIndex( v );\r
1880                         },\r
1881                         displayIndex : function(){\r
1882                                 \r
1883                         },\r
1884                         disabled : function( v ){\r
1885                                 return Node.getPrivateData( this ).disabled( v );\r
1886                         },\r
1887                         cursor : function( v ){\r
1888                                 return Node.getPrivateData( this ).cursor( v );\r
1889                         },\r
1890                         getX : function(){\r
1891                                 \r
1892                         },\r
1893                         getY : function(){\r
1894                                 \r
1895                         },\r
1896                         getWidth : function(){\r
1897                                 \r
1898                         },\r
1899                         getHeight : function(){\r
1900                                 \r
1901                         },\r
1902                         getAbsolutePositionX : function(){\r
1903                                 return Node.getPrivateData( this ).getAbsolutePositionX();\r
1904                         },\r
1905                         getAbsolutePositionY : function(){\r
1906                                 return Node.getPrivateData( this ).getAbsolutePositionY();\r
1907                         },\r
1908                         scrollTo : function( x, y ){\r
1909                                 Node.getPrivateData( this ).scrollTo( x, y );\r
1910                         },\r
1911                         scrollX : function( v ){\r
1912                                 return Node.getPrivateData( this ).scrollX( v );\r
1913                         },\r
1914                         scrollY : function( v ){\r
1915                                 return Node.getPrivateData( this ).scrollY( v );\r
1916                         },\r
1917                         addEventListener : function( type, handler, opt_thisObject ){\r
1918                                 Node.getPrivateData( this ).addEventListener( type, handler, opt_thisObject );\r
1919                         },\r
1920                         removeEventListener : function( type, handler ){\r
1921                                 Node.getPrivateData( this ).removeEventListener( type, handler );\r
1922                         }\r
1923                 }\r
1924         );\r
1925         \r
1926         var LayoutBoxPrivate = NodePrivate.inherits(\r
1927                 'LayoutBoxPrivate',\r
1928                 Class.POOL_OBJECT | Class.SUPER_ACCESS,\r
1929                 {\r
1930                         Constructor : function( layoutManager, _root, _parent ){\r
1931                                 this.layoutManager = layoutManager;\r
1932                                 this._root         = _root;\r
1933                                 this.paintList     = [];\r
1934                                 if( _parent ) this._parent = _parent;\r
1935                         },\r
1936                         mesure : function(){\r
1937                                 this.layoutManager.reflow( this );\r
1938                         },\r
1939                         paintReserve : function( nodeData ){\r
1940                                 var list = this.paintList;\r
1941                                 if( Util.getIndex( list, nodeData ) === -1 ) list[ list.length - 1 ] = nodeData;\r
1942                         },\r
1943                         paintRelease : function( nodeData ){\r
1944                                 var list = this.paintList,\r
1945                                         i    = Util.getIndex( list, nodeData );\r
1946                                 i === -1 && list.splice( i, 1 );\r
1947                         },\r
1948                         paint : function(){\r
1949                                 var list = this.paintList, i = list.length;\r
1950                                 for( ; i; ){\r
1951                                         list[ --i ].paint();\r
1952                                 };\r
1953                         }\r
1954                 }\r
1955         );\r
1956         \r
1957         var LayoutBox = Node.inherits(\r
1958                 'LayoutBox',\r
1959                 Class.POOL_OBJECT,\r
1960                 LayoutBoxPrivate,\r
1961                 {\r
1962                         Constructor : function( layoutManager, root, parent ){\r
1963                                 LayoutBox.newPrivateData( this, layoutManager, LayoutBox.getPrivateData( root ), parent ? LayoutBox.getPrivateData( parent ) : undefined );\r
1964                         },\r
1965                         layoutManager : function( v ){\r
1966                                 \r
1967                         },\r
1968                         createLayoutBox : function(){\r
1969                                 \r
1970                         },\r
1971                         createContentBox : function(){\r
1972                                 \r
1973                         }\r
1974                 }\r
1975         );\r
1976         \r
1977         var RootNode = Node.inherits(\r
1978                 'RootNode',\r
1979                 Class.POOL_OBJECT,\r
1980                 LayoutBoxPrivate,\r
1981                 {\r
1982                         Constructor : function(){\r
1983                                 RootNode.newPrivateData( this, BasicLayoutManager );\r
1984                         }\r
1985                 }\r
1986         );\r
1987         \r
1988 })( window, document );