OSDN Git Service

Version 0.6.41, fix for Opera8 & NN7.2+.
[pettanr/clientJs.git] / 0.6.x / js / dom / 15_XDomStyle.js
index 31ddc30..d67caa4 100644 (file)
@@ -26,15 +26,7 @@ X.Dom.Style = {
                COMBI             : 2 < 13
        },
        
-       SPECIAL_VALUES : {
-               AUTO : Number.POSITIVE_INFINITY,
-               FULL : X.Dom // something unigue value; 100%
-       },
-       
-       PropNo : {},
-       
        UNIT : {
-               // '' : 0,
                'px'   : 0,
                'em'   : 1,
                'cm'   : 2,
@@ -72,12 +64,6 @@ X.Dom.Style = {
        },
        
        /* fontSize -> font-size */
-       /*
-       REG_LARGE : /[A-Z]/g,
-       uncamelize: function( str ){
-               return str.split( ' ' ).join( '' ).replace( X.Dom.Style.REG_LARGE, '-$&' ).toLowerCase();
-       }, */
-       
        CHAR_CODE_A : 'A'.charCodeAt( 0 ),
        
        _DICTIONARY_UNCAMELIZE : {},
@@ -254,6 +240,64 @@ _GRNERAL
                LEMONCHIFFON  : 0xFFFACD
        },
        
+       parseColor : function( x ){
+               var rgb, r, g, b;
+               
+               if( X.Type.isNumber( x ) ){
+                       return ( 0x0 <= x && x <= 0xFFFFFF ) ? x : undefined;
+               } else
+               if( !X.Type.isString( x ) ) return;
+               
+               if( X.Type.isNumber( rgb = X.Dom.Style.COLOR[ x.toUpperCase() ] ) && 0x0 <= rgb && rgb <= 0xFFFFFF ){
+                       return rgb;
+               } else
+               if( x.charAt( 0 ) === '#' ){
+                       switch( x.length ){
+                               case 7 :
+                                       r = parseInt( x.substr( 1, 2 ), 16 );
+                                       g = parseInt( x.substr( 3, 2 ), 16 );
+                                       b = parseInt( x.substr( 5, 2 ), 16 );
+                                       break;
+                               case 4 :
+                                       r = parseInt( x.charAt( 1 ) + x.charAt( 1 ), 16 );
+                                       g = parseInt( x.charAt( 2 ) + x.charAt( 2 ), 16 );
+                                       b = parseInt( x.charAt( 3 ) + x.charAt( 3 ), 16 );
+                                       break;
+                               case 2 :
+                                       r = g = b = parseInt( x.charAt( 1 ) + x.charAt( 1 ), 16 );
+                                       break;
+                               default :
+                                       return;                                                                                 
+                       };
+               } else
+               if( x.indexOf( 'rgb(' ) === 0 ){
+                       rgb = x.substr( 4 ).split( ',' );
+                       r = parseFloat( rgb[ 0 ] );
+                       g = parseFloat( rgb[ 1 ] );
+                       b = parseFloat( rgb[ 2 ] );
+                       if( x.indexOf( '%' ) !== -1 ){
+                               r *= 2.55;
+                               g *= 2.55;
+                               b *= 2.55;
+                       };
+               } else
+               if( x.indexOf( 'rgba(' ) === 0 ){
+                       rgb = x.substr( 5 ).split( ',' );
+                       r = parseFloat( rgb[ 0 ] );
+                       g = parseFloat( rgb[ 1 ] );
+                       b = parseFloat( rgb[ 2 ] );
+                       //a = parseFloat( rgb[ 3 ] );
+                       if( x.indexOf( '%' ) !== -1 ){
+                               r *= 2.55;
+                               g *= 2.55;
+                               b *= 2.55;
+                       };
+               } else {
+                       return undefined;
+               };
+               return isFinite( r + b + g ) ? ( r << 16 ) + ( g << 8 ) + b : undefined;
+       },
+       
        PARAMS : ( function(){
                var ret = {};
                register( ret.percent = {},
@@ -640,7 +684,7 @@ _GRNERAL
                                        _1  = all[ 1 ];
                                        _2  = all[ 2 ];
                                        _3  = all[ 3 ];
-                                       vu  = XDomStyle._Util._splitValueAndUnit( _0 );
+                                       vu  = XDomStyle._splitValueAndUnit( _0 );
                                        v   = vu[ 0 ];
                                        u   = vu[ 1 ];
                                        switch( all.length ){
@@ -653,7 +697,7 @@ _GRNERAL
                                                case 2 :
                                                        top    = new Property( props[ 0 ], v, u, xnode );
                                                        bottom = new Property( props[ 2 ], v, u, xnode );
-                                                       vu     = XDomStyle._Util._splitValueAndUnit( _1 );
+                                                       vu     = XDomStyle._splitValueAndUnit( _1 );
                                                        v      = vu[ 0 ];
                                                        u      = vu[ 1 ];
                                                        right  = new Property( props[ 1 ], v, u, xnode );
@@ -661,27 +705,27 @@ _GRNERAL
                                                        break;
                                                case 3 :
                                                        top    = new Property( props[ 0 ], v, u, xnode );
-                                                       vu     = XDomStyle._Util._splitValueAndUnit( _1 );
+                                                       vu     = XDomStyle._splitValueAndUnit( _1 );
                                                        v      = vu[ 0 ];
                                                        u      = vu[ 1 ];
                                                        right  = new Property( props[ 1 ], v, u, xnode );
                                                        left   = new Property( props[ 3 ], v, u, xnode );
-                                                       vu     = XDomStyle._Util._splitValueAndUnit( _2 );
+                                                       vu     = XDomStyle._splitValueAndUnit( _2 );
                                                        v      = vu[ 0 ];
                                                        u      = vu[ 1 ];
                                                        bottom = new Property( props[ 2 ], v, u, xnode );
                                                        break;
                                                case 4 :
                                                        top    = new Property( props[ 0 ], v, u, xnode );
-                                                       vu     = XDomStyle._Util._splitValueAndUnit( _1 );
+                                                       vu     = XDomStyle._splitValueAndUnit( _1 );
                                                        v      = vu[ 0 ];
                                                        u      = vu[ 1 ];
                                                        right  = new Property( props[ 1 ], v, u, xnode );
-                                                       vu     = XDomStyle._Util._splitValueAndUnit( _2 );
+                                                       vu     = XDomStyle._splitValueAndUnit( _2 );
                                                        v      = vu[ 0 ];
                                                        u      = vu[ 1 ];
                                                        bottom = new Property( props[ 2 ], v,u, xnode );
-                                                       vu     = XDomStyle._Util._splitValueAndUnit( _3 );
+                                                       vu     = XDomStyle._splitValueAndUnit( _3 );
                                                        v      = vu[ 0 ];
                                                        u      = vu[ 1 ];
                                                        left   = new Property( props[ 3 ], v, u, xnode );
@@ -738,8 +782,8 @@ _GRNERAL
                                        if( ret.isValid() === true ) return ret;
                                        ret.kill();
                                        xy = css[ p ].split( ' ' );
-                                       x  = XDomStyle._Util._splitValueAndUnit( xy[ 0 ] );
-                                       y  = XDomStyle._Util._splitValueAndUnit( xy[ 1 ] );
+                                       x  = XDomStyle._splitValueAndUnit( xy[ 0 ] );
+                                       y  = XDomStyle._splitValueAndUnit( xy[ 1 ] );
                                        return
                                                new PropertyGroup(
                                                        p,
@@ -748,7 +792,7 @@ _GRNERAL
                                                );
                        };
                        // opacity, zindex, lineHeight
-                       vu = XDomStyle._Util._splitValueAndUnit( css[ p ] );
+                       vu = XDomStyle._splitValueAndUnit( css[ p ] );
                        return new Property( p, vu[ 0 ], vu[ 1 ], xnode );
                };
                var x = css[ p ], e, v, u;
@@ -771,44 +815,21 @@ _GRNERAL
                        return new Property( p, v, 'px', xnode );
                };
                if( PARAMS.offset[ p ] || PARAMS.percent[ p ] || PARAMS.size[ p ] ){
-                       vu = XDomStyle._Util._splitValueAndUnit( x );
+                       vu = XDomStyle._splitValueAndUnit( x );
                        return new Property( p, vu[ 0 ], vu[ 1 ], xnode );
                };
 
                if( PARAMS.color[ p ] ) return new ColorProperty( p, x );
        },
        
-       _Util : {
-               /*
-               getValue: function( x ){
-                       return X.Type.isString( x ) ? parseInt( x ) :
-                              X.Type.isNumber( x ) ? x : 0;
-               },
-               getUnit: function( x, p ){
-                       
-
-       var REG_UINIT      = /.*\d(\w{1,2})?/,
-               $1             = '$1',
-
-                       
-                       var u;
-                       if( X.Type.isString( x ) === true ){
-                               u = x.replace( REG_UINIT, $1 );
-                               if( p === 'lineHeight' ) return u;
-                               if( PARAMS.unit[ u ] !== true ) return 'px';
-                               return u;
-                       };
-                       return 'px';
-               }, */
-               _splitValueAndUnit : function( v ){
-                       var num, _num, i, u;
-                       if( X.Type.isNumber( v ) ) return [ v || 0, '' ];
-                       if( isNaN( num = parseInt( v ) ) ) return [ 0, '' ];
-                       _num = '' + num;
-                       i = v.indexOf( _num ) + _num.length;
-                       u = v.substr( i );
-                       return [ num, X.Dom.Style.UNIT[ u ] ? u : 'px' ];
-               }               
+       _splitValueAndUnit : function( v ){
+               var num, _num, u;
+               if( X.Type.isNumber( v ) ) return [ v || 0, '' ];
+               if( isNaN( num = parseFloat( v ) ) ) return [ 0, '' ];
+               _num = '' + num;
+               if( _num.indexOf( '0.' ) === 0 ) _num = _num.slice( 1 );
+               u = v.substr( v.indexOf( _num ) + _num.length );
+               return [ num, X.Dom.Style.UNIT[ u ] ? u : 'px' ];
        }
 };
 
@@ -976,8 +997,8 @@ X.Dom.Node.prototype.css = function( nameOrObj /* orUnitID, valuOrUnitOrName */
                return this;
        } else
        if( 1 < args.length ){
-               if( !( unit = XDomStyle.UNIT[ nameOrObj ] ) ){
-// setter name, value                  
+               if( !XDomStyle.UNIT[ nameOrObj ] ){
+// setter name, value
                        if( !css ) css = this._css = {};
                        name = XDomStyle.camelize( nameOrObj );
                        v    = args[ 1 ];
@@ -1004,8 +1025,8 @@ X.Dom.Node.prototype.css = function( nameOrObj /* orUnitID, valuOrUnitOrName */
 // unit 付の値取得は fontSize と 画像サイズが確定していないと正確に取れない。内部のみにする?
                if( !css ) return;
                if( !XDomStyle._GET_VALUE_WITH_UNIT[ name = XDomStyle.camelize( args[ 1 ] ) ] ) return null;
-               p = XDomStyle._getProperty( this, css, unit, name );
-               v = p.pxTo( unit );
+               p = XDomStyle._getProperty( this, css, nameOrObj, name );
+               v = p.pxTo( nameOrObj );
                p.kill();
                return v;
        };
@@ -1018,8 +1039,17 @@ X.Dom.Node.prototype.css = function( nameOrObj /* orUnitID, valuOrUnitOrName */
 
 X.Dom.Node.prototype.cssText = function( v ){
        var obj, i, l, attr, name;
+       if( v === '' ){
+               delete this._css;
+               this._state &= ~X.Dom.State.IE5_DISPLAY_NONE_FIX;
+               this._dirty |= X.Dom.Dirty.CSS;
+               this.parent && this._reserveUpdate();
+               delete this._cssText;
+               return this;
+       } else
        if( X.Type.isString( v ) ){
                delete this._css;
+               this._state &= ~X.Dom.State.IE5_DISPLAY_NONE_FIX;
                obj = {};
                v   = v.split( ';' );
                for( i = 0, l = v.length; i < l; ++i ){
@@ -1036,71 +1066,118 @@ X.Dom.Node.prototype.cssText = function( v ){
 };
 
 /*
- * ここでは HTMLElement のチャックは行わない!
+ * ここでは HTMLElement のチ1ェックは行わない!
+ * TODO
+ * body に css attr がセットされた場合には X.Dom.baseFontSize をクリア
  */
+
 X.Dom.Node.prototype._getCharSize =
        window.getComputedStyle ?
                (function(){
-                       return parseInt( getComputedStyle( this._rawNode, null ).fontSize );
+                       Node.root._updateTimerID && Node.root._startUpdate();
+                       if( this === Node.root && X.Dom.baseFontSize ) return X.Dom.baseFontSize;
+                       if( this._fontSize ) return this._fontSize;
+                       return this._fontSize = parseFloat( getComputedStyle( this._rawNode, null ).fontSize );
                }) :
        document.defaultView && document.defaultView.getComputedStyle ?
                (function(){
-                       return parseInt( document.defaultView.getComputedStyle( this._rawNode, null ).fontSize );
+                       Node.root._updateTimerID && Node.root._startUpdate();
+                       if( this === Node.root && X.Dom.baseFontSize ) return X.Dom.baseFontSize;
+                       if( this._fontSize ) return this._fontSize;
+                       return this._fontSize = parseFloat( document.defaultView.getComputedStyle( this._rawNode, null ).fontSize );
                }) :
        X.UA.IE && 5.5 <= X.UA.IE ?
                (function(){
-                       if( this === Node.root && X.Dom.Event._lastFontSize ) return X.Dom.Event._lastFontSize;
-                       var font = this._rawNode.currentStyle.fontSize,
-                               vu   = X.Dom.Style._Util._splitValueAndUnit( font ),
-                               v    = vu[ 0 ],
-                               u    = vu[ 1 ],
-                               elm;    
+                       var font, vu, v, u, _v;
+                       Node.root._updateTimerID && Node.root._startUpdate();
+                       if( this === Node.root && X.Dom.baseFontSize ) return X.Dom.baseFontSize;
+                       if( this._fontSize ) return this._fontSize;
+                       
+                       font = this._rawNode.currentStyle.fontSize;
+                       //font = this._css && this._css.fontSize || '1em';
+                       vu   = X.Dom.Style._splitValueAndUnit( font );
+                       v    = vu[ 0 ];
+                       u    = vu[ 1 ];
+
                        if( v === 0 ){
-                               if( v = X.Dom.Style._FONT_SIZE_RATIO[ font ] ) return v;
+                               if( v = X.Dom.Style._FONT_SIZE_RATIO[ font ] ) return this._fontSize = v;
                        } else {
-                               if( u = X.Dom.Style._UNIT_RATIO[ u ] ) return v / u;
+                               if( _v = X.Dom.Style._UNIT_RATIO[ u ] ) return this._fontSize = v / _v;
                        };
                        switch( u ){
                                case 'px' :
-                                       return v;
+                                       return this._fontSize = v;
                                case 'em' :
                                // body まで辿ってしまった場合は?
-                                       if( this.parent ) return this.parent._getCharSize() * v;
+                                       if( this.parent ) return this._fontSize = this.parent._getCharSize() * v;
                                        break;
                                case '%' :
                                // body まで辿ってしまった場合は?
-                                       if( this.parent ) return this.parent._getCharSize() * v / 100;
-                                       break;
+                                       if( this.parent ) return this._fontSize = this.parent._getCharSize() * v / 100;
                        };
-                       elm = document.createElement( 'div' );
-                       Node._systemNode._rawNode.appendChild( elm );
-                       elm.style.cssText = 'position:absolute;top:0;left:0;overflow:hidden;line-height:1;height:1em;';
-                       elm.innerText = 'X';
-                       v = elm.offsetHeight;
-                       Node._systemNode._rawNode.removeChild( elm );
-                       return v;
+                       return 0;
                }) :
-       document.getElementById ?
+       X.Dom.DOM_W3C ?
                (function(){
-                       var elm = document.createElement( 'span' ),
-                               v;
-                       this._rawNode.appendChild( elm );
+                       var elm, v;
+                       Node.root._updateTimerID && Node.root._startUpdate();
+                       if( this === Node.root && X.Dom.baseFontSize ) return X.Dom.baseFontSize;
+                       if( this._fontSize ) return this._fontSize;
+
+                       this._rawNode.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';                    
+                       elm.innerHTML = 'X';
                        v = elm.offsetHeight;
                        this._rawNode.removeChild( elm );
-                       return v;
+                       return this._fontSize = v;
                }) :
-       X.UA.IE ?
+       X.Dom.DOM_IE4 ?
                (function(){
-                       var elm = this._rawNode || this._ie4getRawNode(), v;
+                       var font, vu, v, u, _v;
+                       Node.root._updateTimerID && Node.root._startUpdate();
+                       if( this === Node.root && X.Dom.baseFontSize ) return X.Dom.baseFontSize;
+                       if( this._fontSize ) return this._fontSize;
+                       
+                       if( this._css && ( font = this._css.fontSize ) ){
+                               vu = X.Dom.Style._splitValueAndUnit( font );
+                               v  = vu[ 0 ];
+                               u  = vu[ 1 ];
+                               
+                               if( v === 0 ){
+                                       if( _v = X.Dom.Style._FONT_SIZE_RATIO[ font ] ) return this._fontSize = _v;
+                               } else {
+                                       if( _v = X.Dom.Style._UNIT_RATIO[ u ] ) return this._fontSize = v / _v;
+                               };
+                       } else {
+                               v = 1;
+                               u = 'em';
+                       };
+
+                       switch( u ){
+                               case 'px' :
+                                       return this._fontSize = v;
+                               case 'em' :
+                               // body まで辿ってしまった場合は?
+                                       if( this.parent ) return this._fontSize = this.parent._getCharSize() * v;
+                                       break;
+                               case '%' :
+                               // body まで辿ってしまった場合は?
+                                       if( this.parent ) return this._fontSize = this.parent._getCharSize() * v / 100;
+                       };
+                       return 0;
+               }) :
+               (function(){
+                       var elm, v;
+                       if( this === Node.root && X.Dom.baseFontSize ) return X.Dom.baseFontSize;
+                       Node.root._updateTimerID && Node.root._startUpdate();
+                       if( this._fontSize ) return this._fontSize;
+                       
+                       elm = this._rawNode || this._ie4getRawNode();
                        elm.insertAdjacentHTML( 'BeforeEnd', '<span style="visivility:hidden;line-height:1;">X</span>' );
                        elm = elm.children[ elm.children.length - 1 ];
                        v   = elm.offsetHeight;
                        elm.outerHTML = '';
-                       return v * 0.75;
-               }) :
-               (function(){
+                       return this._fontSize = v * 0.75;
                });
 
 
@@ -1169,12 +1246,12 @@ X.Dom.listenOnce( X.Dom.Event.DOM_PRE_INIT, function(){
 X.Dom.listenOnce( X.Dom.Event.DOM_INIT, function(){
        var xnode  = Node._systemNode,
                output = X.Dom.Style._UNIT_RATIO = {},
-               list   = 'em,cm,mm,in,pt,pc'.split( ',' ),
+               list   = 'cm,mm,in,pt,pc'.split( ',' ),
                unit,size, base, i;
        
        for( i = list.length; i; ){
                unit = list[ --i ];
-               output[ unit ] = xnode.css( 'width', 100 + unit ).width() / 100;
+               output[ unit ] = xnode.css( 'width', 10 + unit ).width() / 10;
        };
 
        output = X.Dom.Style._FONT_SIZE_RATIO = {},