X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.6.x%2Fjs%2F02_dom%2F06_XNodeCSS.js;h=9711a5ebec645fcadd67b009d0a1051ee98e833f;hb=475df4df9670f042764a99c80d7716e994d28033;hp=d47ca8a0572f378b63a8056b8ca57d9e1f0942ce;hpb=9a3ec59dd9eafb9fde293ee2f112e168af1e62bc;p=pettanr%2FclientJs.git diff --git a/0.6.x/js/02_dom/06_XNodeCSS.js b/0.6.x/js/02_dom/06_XNodeCSS.js index d47ca8a..9711a5e 100644 --- a/0.6.x/js/02_dom/06_XNodeCSS.js +++ b/0.6.x/js/02_dom/06_XNodeCSS.js @@ -47,15 +47,15 @@ function X_Node_CSS_uncamelize( str ){ var -X_node_CSS_getComputedStyle = window.getComputedStyle || document.defaultView && document.defaultView.getComputedStyle, - - /* font-size -> fontSize */ -X_Node_CSS__DICTIONARY_CAMELIZE = {}, - - /* fontSize -> font-size */ -X_Node_CSS_CHAR_CODE_A = 'A'.charCodeAt( 0 ), + X_Node_CSS_getComputedStyle = window.getComputedStyle || document.defaultView && document.defaultView.getComputedStyle, -X_Node_CSS__DICTIONARY_UNCAMELIZE = {}, + /* font-size -> fontSize */ + X_Node_CSS__DICTIONARY_CAMELIZE = {}, + + /* fontSize -> font-size */ + X_Node_CSS_CHAR_CODE_A = 'A'.charCodeAt( 0 ), + + X_Node_CSS__DICTIONARY_UNCAMELIZE = {}, /* * CSS における display, position, float プロパティの相互関係 @@ -84,12 +84,12 @@ _ABSOLUTE_BOX _FLOAT_BOX _GRNERAL */ -X_Node_CSS_VENDER_PREFIX = {}, - -X_Node_CSS__CLIP_SEPARATOR = X_UA.IE < 8 ? ' ' : ',', - -X_Node_CSS__UNIT_RATIO = {}, -X_Node_CSS__FONT_SIZE_RATIO = {}, + X_Node_CSS_VENDER_PREFIX = {}, + + X_Node_CSS__CLIP_SEPARATOR = X_UA[ 'IE' ] < 8 ? ' ' : ',', + + X_Node_CSS__UNIT_RATIO = {}, + X_Node_CSS__FONT_SIZE_RATIO = {}, // https://developer.mozilla.org/en-US/docs/Web/CSS/transform // Firefox 3.5, ie9, Opera 10.5, Safari 3.1, Chrome @@ -103,98 +103,98 @@ X_Node_CSS__FONT_SIZE_RATIO = {}, // ブラウザ毎の getComputedStyle の戻り値 http://d.hatena.ne.jp/uupaa/20080928/1222543331 -X_Node_CSS_COLOR = { - BLACK : 0x0, - RED : 0xFF0000, - LIME : 0x00FF00, - BLUE : 0x0000FF, - YELLOW : 0xFFFF00, - AQUA : 0x00FFFF, - CYAN : 0x00FFFF, - MAGENTA : 0xFF00FF, - FUCHSIA : 0xFF00FF, - WHITE : 0xFFFFFF, - GREEN : 0x008000, - PURPLE : 0x800080, - MAROON : 0x800000, - NAVY : 0x000080, - OLIVE : 0x808000, - TEAL : 0x008080, - GRAY : 0x808080, - SILVER : 0xC0C0C0, - DIMGRAY : 0x696969, - SLATEGRAY : 0x708090, - DARKGRAY : 0xA9A9A9, - GAINSBORO : 0xDCDCDC, - MIDNIGHTBLUE : 0x191970, - SLATEBLUE : 0x6A5ACD, - MEDIUMBLUE : 0x0000CD, - ROYALBLUE : 0x4169E1, - DODGERBLUE : 0x1E90FF, - SKYBLUE : 0x87CEEB, - STEELBLUE : 0x4682B4, - LIGHTBLUE : 0xADD8E6, - PALETURQUOISE : 0xAFEEEE, - TURQUOISE : 0x40E0D0, - LIGHTCYAN : 0xE0FFFF, - AQUAMARINE : 0x7FFFD4, - DARKGREEN : 0x006400, - SEAGREEN : 0x2E8B57, - LIGHTGREEN : 0x90EE90, - CHARTREUSE : 0x7FFF00, - GREENYELLOW : 0xADFF2F, - LIMEGREEN : 0x32CD32, - YELLOWGREEN : 0x9ACD32, - OLIVEDRAB : 0x6B8E23, - DARKKHAKI : 0xBCB76B, - PALEGOLDENROD : 0xEEE8AA, - LIGHTYELLOW : 0xFFFFE0, - GOLD : 0xFFD700, - GOLDENROD : 0xDAA520, - DARKGOLDENROD : 0xB8860B, - ROSYBROWN : 0xBC8F8F, - INDIANRED : 0xCD5C5C, - SADDLEBROWN : 0x8B4513, - SIENNA : 0xA0522D, - PERU : 0xCD853F, - BURLYWOOD : 0xDEB887, - BEIGE : 0xF5F5DC, - WHEAT : 0xF5DEB3, - SANDYBROWN : 0xF4A460, - TAN : 0xD2B48C, - CHOCOLATE : 0xD2691E, - FIREBRICK : 0xB22222, - BROWN : 0xA52A2A, - SALMON : 0xFA8072, - ORANGE : 0xFFA500, - CORAL : 0xFF7F50, - TOMATO : 0xFF6347, - HOTPINK : 0xFF69B4, - PINK : 0xFFC0CB, - DEEPPINK : 0xFF1493, - PALEVIOLETRED : 0xDB7093, - VIOLET : 0xEE82EE, - PLUM : 0xDDA0DD, - ORCHILD : 0xDA70D6, - DARKVIOLET : 0x9400D3, - BLUEVIOLET : 0x8A2BE2, - MEDIUMPURPLE : 0x9370DB, - THISTLE : 0xD8BFD8, - LAVENDER : 0xE6E6FA, - MISTYROSE : 0xFFE4E1, - IVORY : 0xFFFFF0, - LEMONCHIFFON : 0xFFFACD -}; + X_Node_CSS_COLOR = { + 'BLACK' : 0x0, + 'RED' : 0xFF0000, + 'LIME' : 0x00FF00, + 'BLUE' : 0x0000FF, + 'YELLOW' : 0xFFFF00, + 'AQUA' : 0x00FFFF, + 'CYAN' : 0x00FFFF, + 'MAGENTA' : 0xFF00FF, + 'FUCHSIA' : 0xFF00FF, + 'WHITE' : 0xFFFFFF, + 'GREEN' : 0x008000, + 'PURPLE' : 0x800080, + 'MAROON' : 0x800000, + 'NAVY' : 0x000080, + 'OLIVE' : 0x808000, + 'TEAL' : 0x008080, + 'GRAY' : 0x808080, + 'SILVER' : 0xC0C0C0, + 'DIMGRAY' : 0x696969, + 'SLATEGRAY' : 0x708090, + 'DARKGRAY' : 0xA9A9A9, + 'GAINSBORO' : 0xDCDCDC, + 'MIDNIGHTBLUE' : 0x191970, + 'SLATEBLUE' : 0x6A5ACD, + 'MEDIUMBLUE' : 0x0000CD, + 'ROYALBLUE' : 0x4169E1, + 'DODGERBLUE' : 0x1E90FF, + 'SKYBLUE' : 0x87CEEB, + 'STEELBLUE' : 0x4682B4, + 'LIGHTBLUE' : 0xADD8E6, + 'PALETURQUOISE' : 0xAFEEEE, + 'TURQUOISE' : 0x40E0D0, + 'LIGHTCYAN' : 0xE0FFFF, + 'AQUAMARINE' : 0x7FFFD4, + 'DARKGREEN' : 0x006400, + 'SEAGREEN' : 0x2E8B57, + 'LIGHTGREEN' : 0x90EE90, + 'CHARTREUSE' : 0x7FFF00, + 'GREENYELLOW' : 0xADFF2F, + 'LIMEGREEN' : 0x32CD32, + 'YELLOWGREEN' : 0x9ACD32, + 'OLIVEDRAB' : 0x6B8E23, + 'DARKKHAKI' : 0xBCB76B, + 'PALEGOLDENROD' : 0xEEE8AA, + 'LIGHTYELLOW' : 0xFFFFE0, + 'GOLD' : 0xFFD700, + 'GOLDENROD' : 0xDAA520, + 'DARKGOLDENROD' : 0xB8860B, + 'ROSYBROWN' : 0xBC8F8F, + 'INDIANRED' : 0xCD5C5C, + 'SADDLEBROWN' : 0x8B4513, + 'SIENNA' : 0xA0522D, + 'PERU' : 0xCD853F, + 'BURLYWOOD' : 0xDEB887, + 'BEIGE' : 0xF5F5DC, + 'WHEAT' : 0xF5DEB3, + 'SANDYBROWN' : 0xF4A460, + 'TAN' : 0xD2B48C, + 'CHOCOLATE' : 0xD2691E, + 'FIREBRICK' : 0xB22222, + 'BROWN' : 0xA52A2A, + 'SALMON' : 0xFA8072, + 'ORANGE' : 0xFFA500, + 'CORAL' : 0xFF7F50, + 'TOMATO' : 0xFF6347, + 'HOTPINK' : 0xFF69B4, + 'PINK' : 0xFFC0CB, + 'DEEPPINK' : 0xFF1493, + 'PALEVIOLETRED' : 0xDB7093, + 'VIOLET' : 0xEE82EE, + 'PLUM' : 0xDDA0DD, + 'ORCHILD' : 0xDA70D6, + 'DARKVIOLET' : 0x9400D3, + 'BLUEVIOLET' : 0x8A2BE2, + 'MEDIUMPURPLE' : 0x9370DB, + 'THISTLE' : 0xD8BFD8, + 'LAVENDER' : 0xE6E6FA, + 'MISTYROSE' : 0xFFE4E1, + 'IVORY' : 0xFFFFF0, + 'LEMONCHIFFON' : 0xFFFACD + }; function X_Node_CSS_parseColor( x ){ var rgb, r, g, b; - if( X.Type.isNumber( x ) ){ + if( X_Type_isNumber( x ) ){ return ( 0x0 <= x && x <= 0xFFFFFF ) ? x : undefined; } else - if( !X.Type.isString( x ) ) return; + if( !X_Type_isString( x ) ) return; - if( X.Type.isNumber( rgb = X_Node_CSS_COLOR[ x.toUpperCase() ] ) && 0x0 <= rgb && rgb <= 0xFFFFFF ){ + if( X_Type_isNumber( rgb = X_Node_CSS_COLOR[ x.toUpperCase() ] ) && 0x0 <= rgb && rgb <= 0xFFFFFF ){ return rgb; } else if( x.charAt( 0 ) === '#' ){ @@ -245,16 +245,16 @@ function X_Node_CSS_parseColor( x ){ }; function X_Node_CSS_objToCssText( that, skipFilter ){ - var obj = that._css, + var obj = that[ '_css' ], plain = X_EMPTY_OBJECT, css = [], n = -1, p, v, specialFix, filterFix; - that._flags &= ~X_Node_State.OLD_CSSTEXT; + that[ '_flags' ] &= ~X_NodeFlags_OLD_CSSTEXT; if( !obj ){ // Opera7.5 未満? - delete that._cssText; + delete that[ '_cssText' ]; return ''; }; @@ -285,33 +285,35 @@ function X_Node_CSS_objToCssText( that, skipFilter ){ }; if( 0 <= n ){ - that._cssText = css.join( ';' ); + // cssText には完全なものを控えるが、戻すのは filter を抜いたもの + that[ '_cssText' ] = css.join( ';' ); if( skipFilter ){ --css.length; return css.join( ';' ); }; - return that._cssText; + return that[ '_cssText' ]; }; - delete that._cssText; + delete that[ '_cssText' ]; return ''; }; var X_Node_CSS_FILTER_FIX_PROPS = - X_UA.ActiveX && X_UA.IE < 9 && !X_UA.MacIE ? + X_UA[ 'ActiveX' ] && X_UA[ 'IE' ] < 9 && !X_UA[ 'MacIE' ] ? { - opacity : 2, - boxShadow : 3, - textShadow : 4 + 'opacity' : 2, + 'boxShadow' : 3, + 'textShadow' : 4, + 'transform' : 5 } : - X_UA.ActiveX && X_UA.IE9 ? // == 9 + X_UA[ 'ActiveX' ] && X_UA[ 'IE9' ] ? // == 9 { - textShadow : 4 + 'textShadow' : 4 } : null; function X_Node_CSS_objToIEFilterText( that, opt_css ){ - var obj = opt_css || that._css, + var obj = opt_css || that[ '_css' ], test = X_Node_CSS_FILTER_FIX_PROPS, filters = [], n = -1, @@ -391,7 +393,7 @@ function X_Node_CSS_objToIEFilterText( that, opt_css ){ }; if( afterUpdate ){ // AFTER_UPDATE 時に 再計算 - X_ViewPort.listenOnce( X_Event.AFTER_UPDATE, that, X_Node_CSS_onAfterUpdateForIEFilterFix ); + X_ViewPort[ 'listenOnce' ]( X_EVENT_AFTER_UPDATE, that, X_Node_CSS_onAfterUpdateForIEFilterFix ); break; }; dir = Math.atan2( params[ 1 ] + params[ 3 ], params[ 0 ] + params[ 3 ] ) * 180 / Math.PI + 90; @@ -403,16 +405,19 @@ function X_Node_CSS_objToIEFilterText( that, opt_css ){ //glow(Color=yellow,Strength=10); //どうやらCSSのbackgroundプロパティと同時に使えないようです。 s break; - case 5 : //'backgroundImage' : + case 6 : //'backgroundImage' : // + + case 5 : // transform scale, matrix + }; }; return filters.join( ' ' ); }; function X_Node_CSS_onAfterUpdateForIEFilterFix(){ - if( this._flags & X_Node_State.IN_TREE ){ // 要素があり、要素がツリーに属している - this._flags |= X_Node_State.DIRTY_IE_FILTER; + if( this[ '_flags' ] & X_NodeFlags_IN_TREE ){ // 要素があり、要素がツリーに属している + this[ '_flags' ] |= X_NodeFlags_DIRTY_IE_FILTER; X_Node_reserveUpdate(); }; }; @@ -447,7 +452,7 @@ X_Node_CSS_UNIT = { */ function X_Node_CSS__splitValueAndUnit( v ){ var num, _num, u; - if( X.Type.isNumber( v ) ) return [ v || 0, '' ]; + if( X_Type_isNumber( v ) ) return [ v || 0, '' ]; num = parseFloat( v ); if( num !== num ) return [ 0, '' ]; _num = '' + num; @@ -499,18 +504,31 @@ function X_Node_CSS__splitValueAndUnit( v ){ // unitID, name 単位指定のプロパティ取得 geter // obj setter // name, value setter - -Node.prototype.css = function( nameOrObj /* orUnitID, valuOrUnitOrName */ ){ +/** + * style の getter と setter。 + * @alias Node.prototype.css + * @param {string|object} [nameOrObj] style 名、または追加する style のハッシュ + * @param {string|number} [value=] style の値 + * @return {Node|string|number} getter の場合は値を、setter の場合は自身を返す。(メソッドチェーン) + * @example // getter + * node.css( 'color' ); + * // setter - 1 + * node.css( { width : w + 'px', height : h + 'px' } ); + * // setter - 2 + * node.css( 'color', 0x666666 ); + */ +function X_Node_css( nameOrObj /* value */ ){ var args = arguments, - css = this._css, + css = this[ '_css' ], p, name, v, plain, camelize, flags; - if( !this._tag ) return this; + + if( !this[ '_tag' ] || X_Dom_DTD_MOVE_TO_HEAD[ this[ '_tag' ] ] || this[ '_tag' ] === 'SCRIPT' ) return this; // setter:object - if( X.Type.isObject( nameOrObj ) ){ - if( !css ) css = this._css = {}; + if( X_Type_isObject( nameOrObj ) ){ + if( !css ) css = this[ '_css' ] = {}; plain = X_EMPTY_OBJECT; camelize = X_Node_CSS_camelize; - flags = this._flags; + flags = this[ '_flags' ]; for( p in nameOrObj ){ if( plain[ p ] ) continue; name = camelize( p ); @@ -518,25 +536,26 @@ Node.prototype.css = function( nameOrObj /* orUnitID, valuOrUnitOrName */ ){ if( css[ name ] === v ) continue; flags = X_Node_CSS_setStyle( css, flags, name, v ); }; - this._flags = flags | X_Node_State.DIRTY_CSS | X_Node_State.OLD_CSSTEXT; - this._flags & X_Node_State.IN_TREE && X_Node_reserveUpdate(); - delete this._cssText; + flags |= X_NodeFlags_DIRTY_CSS | X_NodeFlags_OLD_CSSTEXT; + this[ '_flags' ] = flags; + flags & X_NodeFlags_IN_TREE && X_Node_reserveUpdate(); + delete this[ '_cssText' ]; return this; } else if( 1 < args.length ){ // setter name, value - if( !css ) css = this._css = {}; + if( !css ) css = this[ '_css' ] = {}; name = X_Node_CSS_camelize( nameOrObj ); v = args[ 1 ]; if( css[ name ] === v ) return this; - this._flags = X_Node_CSS_setStyle( css, this._flags, name, v ) | X_Node_State.DIRTY_CSS | X_Node_State.OLD_CSSTEXT; - this._flags & X_Node_State.IN_TREE && X_Node_reserveUpdate(); - delete this._cssText; + this[ '_flags' ] = X_Node_CSS_setStyle( css, this[ '_flags' ], name, v ) | X_NodeFlags_DIRTY_CSS | X_NodeFlags_OLD_CSSTEXT; + this[ '_flags' ] & X_NodeFlags_IN_TREE && X_Node_reserveUpdate(); + delete this[ '_cssText' ]; return this; }; // getter if( !css ) return; - // 集計 border, padding, margin, backgroundPosition, clip + // TODO 集計 border, padding, margin, backgroundPosition, clip // TODO border で正確なデータを返せない時は、null を返す return css[ X_Node_CSS_camelize( nameOrObj ) ]; }; @@ -544,7 +563,7 @@ Node.prototype.css = function( nameOrObj /* orUnitID, valuOrUnitOrName */ ){ function X_Node_CSS_setStyle( css, flags, name, newValue ){ if( X_Node_CSS_FILTER_FIX_PROPS && X_Node_CSS_FILTER_FIX_PROPS[ name ] ){ - flags |= X_Node_State.DIRTY_IE_FILTER; + flags |= X_NodeFlags_DIRTY_IE_FILTER; }; if( !newValue && newValue !== 0 ){ delete css[ name ]; @@ -554,49 +573,50 @@ function X_Node_CSS_setStyle( css, flags, name, newValue ){ switch( name ){ case 'display' : - newValue === 'none' ? ( flags |= X_Node_State.STYLE_IS_DISPLAY_NONE ) : ( flags &= ~X_Node_State.STYLE_IS_DISPLAY_NONE ); + console.log( newValue ); + newValue === 'none' ? ( flags |= X_NodeFlags_STYLE_IS_DISPLAY_NONE ) : ( flags &= ~X_NodeFlags_STYLE_IS_DISPLAY_NONE ); return flags; case 'visibility' : // すでに opacity:0 で invisible - if( flags & X_Node_State.STYLE_IS_INVISIBLE && css[ 'opacity' ] == 0 ) return flags; - newValue === 'hidden' ? ( flags |= X_Node_State.STYLE_IS_INVISIBLE ) : ( flags &= ~X_Node_State.STYLE_IS_INVISIBLE ); + if( flags & X_NodeFlags_STYLE_IS_INVISIBLE && css[ 'opacity' ] == 0 ) return flags; + newValue === 'hidden' ? ( flags |= X_NodeFlags_STYLE_IS_INVISIBLE ) : ( flags &= ~X_NodeFlags_STYLE_IS_INVISIBLE ); return flags; case 'opacity' : // すでに visibility:hidden で invisible - if( flags & X_Node_State.STYLE_IS_INVISIBLE && css[ 'visibility' ] === 'hidden' ) return flags; + if( flags & X_NodeFlags_STYLE_IS_INVISIBLE && css[ 'visibility' ] === 'hidden' ) return flags; newValue == 0 ? // 0 or "0" - ( flags |= X_Node_State.STYLE_IS_INVISIBLE ) : ( flags &= ~X_Node_State.STYLE_IS_INVISIBLE ); + ( flags |= X_NodeFlags_STYLE_IS_INVISIBLE ) : ( flags &= ~X_NodeFlags_STYLE_IS_INVISIBLE ); return flags; case 'overflow' : - newValue === 'hidden' ? ( flags |= X_Node_State.STYLE_IS_NO_OVERFLOW ) : ( flags &= ~X_Node_State.STYLE_IS_NO_OVERFLOW ); + newValue === 'hidden' ? ( flags |= X_NodeFlags_STYLE_IS_NO_OVERFLOW ) : ( flags &= ~X_NodeFlags_STYLE_IS_NO_OVERFLOW ); return flags; case 'position' : - newValue === 'absolute' ? ( flags |= X_Node_State.STYLE_IS_POS_ABSOLUTE ) : ( flags &= ~X_Node_State.STYLE_IS_POS_ABSOLUTE ); + newValue === 'absolute' ? ( flags |= X_NodeFlags_STYLE_IS_POS_ABSOLUTE ) : ( flags &= ~X_NodeFlags_STYLE_IS_POS_ABSOLUTE ); return flags; case 'width' : newValue = X_Node_CSS__splitValueAndUnit( newValue ); if( newValue[ 1 ] !== '%' ){ - flags |= X_Node_State.STYLE_IS_WIDTH_LENGTH; - flags &= ~X_Node_State.STYLE_IS_WIDTH_PCT; + flags |= X_NodeFlags_STYLE_IS_WIDTH_LENGTH; + flags &= ~X_NodeFlags_STYLE_IS_WIDTH_PCT; } else { - flags &= ~X_Node_State.STYLE_IS_WIDTH_LENGTH; - flags |= X_Node_State.STYLE_IS_WIDTH_PCT; + flags &= ~X_NodeFlags_STYLE_IS_WIDTH_LENGTH; + flags |= X_NodeFlags_STYLE_IS_WIDTH_PCT; }; return flags; case 'height' : newValue = X_Node_CSS__splitValueAndUnit( newValue ); if( newValue[ 1 ] !== '%' ){ - flags |= X_Node_State.STYLE_IS_HEIGHT_LENGTH; - flags &= ~X_Node_State.STYLE_IS_HEIGHT_PCT; + flags |= X_NodeFlags_STYLE_IS_HEIGHT_LENGTH; + flags &= ~X_NodeFlags_STYLE_IS_HEIGHT_PCT; } else { - flags &= ~X_Node_State.STYLE_IS_HEIGHT_LENGTH; - flags |= X_Node_State.STYLE_IS_HEIGHT_PCT; + flags &= ~X_NodeFlags_STYLE_IS_HEIGHT_LENGTH; + flags |= X_NodeFlags_STYLE_IS_HEIGHT_PCT; }; return flags; @@ -606,34 +626,44 @@ function X_Node_CSS_setStyle( css, flags, name, newValue ){ return flags; }; -Node.prototype.cssText = function( v ){ +/** + * cssText の getter と setter。setter の場合 css と異なり全ての style が書き変わる。 + * @alias Node.prototype.cssText + * @param {string=} v cssText 文字列名 + * @return {Node|string} getter の場合は cssText 文字列を、setter の場合は自身を返す。(メソッドチェーン) + * @example // getter + * node.cssText(); + * // setter + * node.cssText('color:red;width:20px'); + */ +function X_Node_cssText( v ){ var obj, i, l, attr, name; - if( v === this._cssText && ( this._flags & X_Node_State.OLD_CSSTEXT ) === 0 ){ + if( v === this[ '_cssText' ] && ( this[ '_flags' ] & X_NodeFlags_OLD_CSSTEXT ) === 0 ){ return this; }; if( v === '' ){ - delete this._css; - delete this._cssText; - this._flags |= X_Node_State.DIRTY_CSS | X_Node_State.DIRTY_IE_FILTER; - this._flags &= ~X_Node_State.OLD_CSSTEXT; - this._flags & X_Node_State.IN_TREE && X_Node_reserveUpdate(); + delete this[ '_css' ]; + delete this[ '_cssText' ]; + this[ '_flags' ] |= X_NodeFlags_DIRTY_CSS | X_NodeFlags_DIRTY_IE_FILTER; + this[ '_flags' ] &= ~X_NodeFlags_OLD_CSSTEXT; + this[ '_flags' ] & X_NodeFlags_IN_TREE && X_Node_reserveUpdate(); return this; } else - if( X.Type.isString( v ) ){ - delete this._css; + if( X_Type_isString( v ) ){ + delete this[ '_css' ]; obj = {}; - v = v.split( ';' ); // TODO content ";" などにも対応 <- 不要　:before :after 疑似要素には触らない + v = v.split( ';' ); // TODO content ";" などにも対応 <- 不要 :before :after 疑似要素には触らない for( i = 0, l = v.length; i < l; ++i ){ attr = v[ i ].split( ':' ); ( name = attr[ 0 ] ) && ( obj[ name ] = attr[ 1 ] || true ); }; - return this.css( obj ); + return this[ 'css' ]( obj ); }; // getter - this._flags & X_Node_State.OLD_CSSTEXT && X_Node_CSS_objToCssText( this ); - return this._cssText; + this[ '_flags' ] & X_NodeFlags_OLD_CSSTEXT && X_Node_CSS_objToCssText( this ); + return this[ '_cssText' ]; }; /* @@ -646,42 +676,42 @@ Node.prototype.cssText = function( v ){ */ var X_Node_CSS_getCharSize = - X_node_CSS_getComputedStyle ? + X_Node_CSS_getComputedStyle ? (function( that ){ X_Node_updateTimerID && X_Node_startUpdate(); if( that === X_Node_body && X_ViewPort_baseFontSize ) return X_ViewPort_baseFontSize; - if( that._fontSize ) return that._fontSize; - return that._fontSize = parseFloat( X_node_CSS_getComputedStyle( that._rawObject, null ).fontSize ); + if( that[ '_fontSize' ] ) return that[ '_fontSize' ]; + return that[ '_fontSize' ] = parseFloat( X_Node_CSS_getComputedStyle( that[ '_rawObject' ], null ).fontSize ); }) : - 5.5 <= X_UA.IE ? + 5 <= X_UA[ 'IE' ] ? (function( that ){ var font, vu, v, u, _v; X_Node_updateTimerID && X_Node_startUpdate(); if( that === X_Node_body && X_ViewPort_baseFontSize ) return X_ViewPort_baseFontSize; - if( that._fontSize ) return that._fontSize; + if( that[ '_fontSize' ] ) return that[ '_fontSize' ]; - font = that._rawObject.currentStyle.fontSize; - //font = that._css && that._css.fontSize || '1em'; + font = that[ '_rawObject' ].currentStyle.fontSize; + //font = that[ '_css' ] && that[ '_css' ].fontSize || '1em'; vu = X_Node_CSS__splitValueAndUnit( font ); v = vu[ 0 ]; u = vu[ 1 ]; if( v === 0 ){ - if( v = X_Node_CSS__FONT_SIZE_RATIO[ font ] ) return that._fontSize = v; + if( v = X_Node_CSS__FONT_SIZE_RATIO[ font ] ) return that[ '_fontSize' ] = v; } else { - if( _v = X_Node_CSS__UNIT_RATIO[ u ] ) return that._fontSize = v / _v; + if( _v = X_Node_CSS__UNIT_RATIO[ u ] ) return that[ '_fontSize' ] = v / _v; }; switch( u ){ case 'px' : - return that._fontSize = v; + return that[ '_fontSize' ] = v; case 'em' : // body まで辿ってしまった場合は？ - if( that.parent ) return that._fontSize = X_Node_CSS_getCharSize( that.parent ) * v; + if( that.parent ) return that[ '_fontSize' ] = X_Node_CSS_getCharSize( that.parent ) * v; break; case '%' : // body まで辿ってしまった場合は？ - if( that.parent ) return that._fontSize = X_Node_CSS_getCharSize( that.parent ) * v / 100; + if( that.parent ) return that[ '_fontSize' ] = X_Node_CSS_getCharSize( that.parent ) * v / 100; }; return 0; }) : @@ -690,52 +720,52 @@ X_Node_CSS_getCharSize = var elm, v; X_Node_updateTimerID && X_Node_startUpdate(); if( that === X_Node_body && X_ViewPort_baseFontSize ) return X_ViewPort_baseFontSize; - if( that._fontSize ) return that._fontSize; + if( that[ '_fontSize' ] ) return that[ '_fontSize' ]; - that._rawObject.appendChild( elm = document.createElement( 'span' ) ); + that[ '_rawObject' ].appendChild( elm = document.createElement( 'span' ) ); elm.style.cssText = 'display:block;position:absolute;top:0;left:0;visivility:hidden;line-height:1;height:1em;'; elm.innerHTML = 'X'; v = elm.offsetHeight; - that._rawObject.removeChild( elm ); - return that._fontSize = v; + that[ '_rawObject' ].removeChild( elm ); + return that[ '_fontSize' ] = v; }) : X_UA_DOM.IE4 ? (function( that ){ var font, vu, v, u, _v; X_Node_updateTimerID && X_Node_startUpdate(); if( that === X_Node_body && X_ViewPort_baseFontSize ) return X_ViewPort_baseFontSize; - if( that._fontSize ) return that._fontSize; + if( that[ '_fontSize' ] ) return that[ '_fontSize' ]; - if( that._css && ( font = that._css.fontSize ) ){ + if( that[ '_css' ] && ( font = that[ '_css' ].fontSize ) ){ vu = X_Node_CSS__splitValueAndUnit( font ); v = vu[ 0 ]; u = vu[ 1 ]; if( v === 0 ){ - if( _v = X_Node_CSS__FONT_SIZE_RATIO[ font ] ) return that._fontSize = _v; + if( _v = X_Node_CSS__FONT_SIZE_RATIO[ font ] ) return that[ '_fontSize' ] = _v; } else { - if( _v = X_Node_CSS__UNIT_RATIO[ u ] ) return that._fontSize = v / _v; + if( _v = X_Node_CSS__UNIT_RATIO[ u ] ) return that[ '_fontSize' ] = v / _v; }; } else { // 要素を生成して測定! - ( that._rawObject || X_Node__ie4getRawNode( that ) ).insertAdjacentHTML( 'BeforeEnd', '
X
' ); + ( that[ '_rawObject' ] || X_Node__ie4getRawNode( that ) ).insertAdjacentHTML( 'BeforeEnd', '
X
' ); elm = document.all[ 'ie4charsize' ]; v = elm.offsetHeight; elm.removeAttribute( 'id' ); // ? elm.outerHTML = ''; - return that._fontSize = v; + return that[ '_fontSize' ] = v; }; switch( u ){ case 'px' : - return that._fontSize = v; + return that[ '_fontSize' ] = v; case 'em' : // body まで辿ってしまった場合は？ - if( that.parent ) return that._fontSize = X_Node_CSS_getCharSize( that.parent ) * v; + if( that.parent ) return that[ '_fontSize' ] = X_Node_CSS_getCharSize( that.parent ) * v; break; case '%' : // body まで辿ってしまった場合は？ - if( that.parent ) return that._fontSize = X_Node_CSS_getCharSize( that.parent ) * v / 100; + if( that.parent ) return that[ '_fontSize' ] = X_Node_CSS_getCharSize( that.parent ) * v / 100; }; return 0; }) : @@ -745,7 +775,7 @@ var X_Node_CSS_Support = {}, X_Node_CSS_SPECIAL_FIX_PROP = { - transitionDuration : X_UA.Android && !X_UA.Chrome && function( v ){ // bad Android + 'transitionDuration' : X_UA[ 'Android' ] && !X_UA[ 'Chrome' ] && function( v ){ // bad Android return parseFloat( v ) === 0 ? '0.001s' : v; } @@ -755,13 +785,16 @@ var X_Node_CSS_Support = {}, }; -X.CSS = { +/** + * @namespace X.CSS + */ +X[ 'CSS' ] = { - VENDER_PREFIX : X_Node_CSS_VENDER_PREFIX, + 'VENDER_PREFIX' : X_Node_CSS_VENDER_PREFIX, // iscroll で使用 - uncamelize : X_Node_CSS_uncamelize, + 'uncamelize' : X_Node_CSS_uncamelize, - Support : X_Node_CSS_Support + 'Support' : X_Node_CSS_Support }; /* @@ -774,7 +807,7 @@ X.CSS = { */ (function(){ - var testStyle = X_UA.IE4 ? {} : ( /*document.documentElement ||*/ document.createElement( 'div' ) ).style, + var testStyle = X_UA[ 'IE4' ] ? {} : ( /*document.documentElement ||*/ document.createElement( 'div' ) ).style, temp = testStyle.cssText, vendors = 'webkit,Webkit,Moz,moz,Ms,ms,O,o,khtml,Khtml'.split( ',' ), searches = ( @@ -843,7 +876,7 @@ X.CSS = { })(); -X_ViewPort.listenOnce( X_TEMP.SYSTEM_EVENT_INIT, function(){ +X_ViewPort[ 'listenOnce' ]( X_EVENT_INIT, function(){ var xnode = X_Node_systemNode, output = X_Node_CSS__UNIT_RATIO, list = 'cm,mm,in,pt,pc'.split( ',' ), @@ -851,18 +884,19 @@ X_ViewPort.listenOnce( X_TEMP.SYSTEM_EVENT_INIT, function(){ for( i = list.length; i; ){ unit = list[ --i ]; - output[ unit ] = xnode.css( 'width', 10 + unit ).width() / 10; + output[ unit ] = xnode[ 'css' ]( 'width', 10 + unit )[ 'width' ]() / 10; }; output = X_Node_CSS__FONT_SIZE_RATIO, list = 'xx-large,x-large,large,larger,medium,small,smaller,x-small,xx-small'.split( ',' ); - xnode.css( { lineHeight : '100%', height : '1em' } ).text( 'X' ); + xnode[ 'css' ]( { lineHeight : '100%', height : '1em' } )[ 'text' ]( 'X' ); for( i = list.length; i; ){ size = list[ --i ]; - output[ size ] = xnode.css( 'fontSize', size ).height();// / base; + output[ size ] = xnode[ 'css' ]( 'fontSize', size )[ 'height' ]();// / base; }; - xnode.cssText( '' ).empty(); + xnode[ 'cssText' ]( '' )[ 'empty' ](); }); +