/*\r
* pettanR system.js\r
- * version 0.5.15\r
+ * version 0.5.16\r
* \r
* \r
* Type\r
return ret;\r
})( ELM_SIZE_GETTER );\r
\r
+ var REG_LARGE = /[A-Z]/g;\r
+ \r
/* clean comment node */\r
window.setTimeout( function(){\r
Util.cleanCommnetNode();\r
return camelized;\r
},\r
uncamelize: function( str ){\r
- return str.split( ' ' ).join( '' ).replace( /[A-Z]/g, '-$&' ).toLowerCase();\r
+ return str.split( ' ' ).join( '' ).replace( REG_LARGE, '-$&' ).toLowerCase();\r
},\r
pxTo: function( _px, _unit ){\r
return _px / ( UNIT_RATIO[ _unit ] || 1 );\r
\r
// if( style.backgroundPositionX === undefined ){\r
_special.setBackgroundPositionXY = function( style ){\r
- var bgp = style.backgroundPosition.split( ' ' );\r
- style.backgroundPositionX = bgp[ 0 ];\r
- style.backgroundPositionY = bgp[ 1 ];\r
+ var bgp = ( style.backgroundPosition || '' ).split( ' ' );\r
+ style.backgroundPositionX = bgp[ 0 ] || 0;\r
+ style.backgroundPositionY = bgp[ 1 ] || 0;\r
};\r
// };\r
if( style.clipTop === undefined && style[ 'clip-top' ] === undefined ){\r
_special.setClipTopRightBottomLeft = function( style ){\r
- var clip = style.clip;\r
+ var clip = style.clip || '';\r
if( clip.indexOf( 'rect(' ) === -1 ){\r
style.clipTop = 0;\r
style.clipRight = 0;\r
};\r
\r
SPECIAL.setBackgroundPositionXY && SPECIAL.setBackgroundPositionXY( ret );\r
- SPECIAL.setClipTopRightBottomLeft && SPECIAL.getClipTopRightBottomLeft( ret );\r
+ SPECIAL.setClipTopRightBottomLeft && SPECIAL.setClipTopRightBottomLeft( ret );\r
\r
return ret;\r
};\r
var ret = {}, v, name,\r
list = [\r
0, 'BLACK',\r
- parseFloat( 'FF0000', 16 ), 'RED',\r
- parseFloat( '00FF00', 16 ), 'LIME',\r
- parseFloat( '0000FF', 16 ), 'BLUE',\r
- parseFloat( 'FFFF00', 16 ), 'YELLOW',\r
- parseFloat( '00FFFF', 16 ), 'AQUA or CYAN',\r
- parseFloat( 'FF00FF', 16 ), 'FUCHSIA or MAGENTA',\r
- parseFloat( 'FFFFFF', 16 ), 'WHITE',\r
- parseFloat( '008000', 16 ), 'GREEN',\r
- parseFloat( '800080', 16 ), 'PURPLE',\r
- parseFloat( '800000', 16 ), 'MAROON',\r
- parseFloat( '000080', 16 ), 'NAVY',\r
- parseFloat( '808000', 16 ), 'OLIVE',\r
- parseFloat( '008080', 16 ), 'TEAL',\r
- parseFloat( '808080', 16 ), 'GRAY',\r
- parseFloat( 'C0C0C0', 16 ), 'SILVER',\r
- parseFloat( '696969', 16 ), 'DIMGRAY',\r
- parseFloat( '708090', 16 ), 'SLATEGRAY',\r
- parseFloat( 'A9A9A9', 16 ), 'DARKGRAY',\r
- parseFloat( 'DCDCDC', 16 ), 'GAINSBORO',\r
- parseFloat( '191970', 16 ), 'MIDNIGHTBLUE',\r
- parseFloat( '6A5ACD', 16 ), 'SLATEBLUE',\r
- parseFloat( '0000CD', 16 ), 'MEDIUMBLUE',\r
- parseFloat( '4169E1', 16 ), 'ROYALBLUE',\r
- parseFloat( '1E90FF', 16 ), 'DODGERBLUE',\r
- parseFloat( '87CEEB', 16 ), 'SKYBLUE',\r
- parseFloat( '4682B4', 16 ), 'STEELBLUE',\r
- parseFloat( 'ADD8E6', 16 ), 'LIGHTBLUE',\r
- parseFloat( 'AFEEEE', 16 ), 'PALETURQUOISE',\r
- parseFloat( '40E0D0', 16 ), 'TURQUOISE',\r
- parseFloat( 'E0FFFF', 16 ), 'LIGHTCYAN',\r
- parseFloat( '7FFFD4', 16 ), 'AQUAMARINE',\r
- parseFloat( '006400', 16 ), 'DARKGREEN',\r
- parseFloat( '2E8B57', 16 ), 'SEAGREEN',\r
- parseFloat( '90EE90', 16 ), 'LIGHTGREEN',\r
- parseFloat( '7FFF00', 16 ), 'CHARTREUSE',\r
- parseFloat( 'ADFF2F', 16 ), 'GREENYELLOW',\r
- parseFloat( '32CD32', 16 ), 'LIMEGREEN',\r
- parseFloat( '9ACD32', 16 ), 'YELLOWGREEN',\r
- parseFloat( '6B8E23', 16 ), 'OLIVEDRAB',\r
- parseFloat( 'BCB76B', 16 ), 'DARKKHAKI',\r
- parseFloat( 'EEE8AA', 16 ), 'PALEGOLDENROD',\r
- parseFloat( 'FFFFE0', 16 ), 'LIGHTYELLOW',\r
- parseFloat( 'FFD700', 16 ), 'GOLD',\r
- parseFloat( 'DAA520', 16 ), 'GOLDENROD',\r
- parseFloat( 'B8860B', 16 ), 'DARKGOLDENROD',\r
- parseFloat( 'BC8F8F', 16 ), 'ROSYBROWN',\r
- parseFloat( 'CD5C5C', 16 ), 'INDIANRED',\r
- parseFloat( '8B4513', 16 ), 'SADDLEBROWN',\r
- parseFloat( 'A0522D', 16 ), 'SIENNA',\r
- parseFloat( 'CD853F', 16 ), 'PERU',\r
- parseFloat( 'DEB887', 16 ), 'BURLYWOOD',\r
- parseFloat( 'F5F5DC', 16 ), 'BEIGE',\r
- parseFloat( 'F5DEB3', 16 ), 'WHEAT',\r
- parseFloat( 'F4A460', 16 ), 'SANDYBROWN',\r
- parseFloat( 'D2B48C', 16 ), 'TAN',\r
- parseFloat( 'D2691E', 16 ), 'CHOCOLATE',\r
- parseFloat( 'B22222', 16 ), 'FIREBRICK',\r
- parseFloat( 'A52A2A', 16 ), 'BROWN',\r
- parseFloat( 'FA8072', 16 ), 'SALMON',\r
- parseFloat( 'FFA500', 16 ), 'ORANGE',\r
- parseFloat( 'FF7F50', 16 ), 'CORAL',\r
- parseFloat( 'FF6347', 16 ), 'TOMATO',\r
- parseFloat( 'FF69B4', 16 ), 'HOTPINK',\r
- parseFloat( 'FFC0CB', 16 ), 'PINK',\r
- parseFloat( 'FF1493', 16 ), 'DEEPPINK',\r
- parseFloat( 'DB7093', 16 ), 'PALEVIOLETRED',\r
- parseFloat( 'EE82EE', 16 ), 'VIOLET',\r
- parseFloat( 'DDA0DD', 16 ), 'PLUM',\r
- parseFloat( 'DA70D6', 16 ), 'ORCHILD',\r
- parseFloat( '9400D3', 16 ), 'DARKVIOLET',\r
- parseFloat( '8A2BE2', 16 ), 'BLUEVIOLET',\r
- parseFloat( '9370DB', 16 ), 'MEDIUMPURPLE',\r
- parseFloat( 'D8BFD8', 16 ), 'THISTLE',\r
- parseFloat( 'E6E6FA', 16 ), 'LAVENDER',\r
- parseFloat( 'FFE4E1', 16 ), 'MISTYROSE',\r
- parseFloat( 'FFFFF0', 16 ), 'IVORY',\r
- parseFloat( 'FFFACD', 16 ), 'LEMONCHIFFON'\r
+ parseInt( 'FF0000', 16 ), 'RED',\r
+ parseInt( '00FF00', 16 ), 'LIME',\r
+ parseInt( '0000FF', 16 ), 'BLUE',\r
+ parseInt( 'FFFF00', 16 ), 'YELLOW',\r
+ parseInt( '00FFFF', 16 ), 'AQUA or CYAN',\r
+ parseInt( 'FF00FF', 16 ), 'FUCHSIA or MAGENTA',\r
+ parseInt( 'FFFFFF', 16 ), 'WHITE',\r
+ parseInt( '008000', 16 ), 'GREEN',\r
+ parseInt( '800080', 16 ), 'PURPLE',\r
+ parseInt( '800000', 16 ), 'MAROON',\r
+ parseInt( '000080', 16 ), 'NAVY',\r
+ parseInt( '808000', 16 ), 'OLIVE',\r
+ parseInt( '008080', 16 ), 'TEAL',\r
+ parseInt( '808080', 16 ), 'GRAY',\r
+ parseInt( 'C0C0C0', 16 ), 'SILVER',\r
+ parseInt( '696969', 16 ), 'DIMGRAY',\r
+ parseInt( '708090', 16 ), 'SLATEGRAY',\r
+ parseInt( 'A9A9A9', 16 ), 'DARKGRAY',\r
+ parseInt( 'DCDCDC', 16 ), 'GAINSBORO',\r
+ parseInt( '191970', 16 ), 'MIDNIGHTBLUE',\r
+ parseInt( '6A5ACD', 16 ), 'SLATEBLUE',\r
+ parseInt( '0000CD', 16 ), 'MEDIUMBLUE',\r
+ parseInt( '4169E1', 16 ), 'ROYALBLUE',\r
+ parseInt( '1E90FF', 16 ), 'DODGERBLUE',\r
+ parseInt( '87CEEB', 16 ), 'SKYBLUE',\r
+ parseInt( '4682B4', 16 ), 'STEELBLUE',\r
+ parseInt( 'ADD8E6', 16 ), 'LIGHTBLUE',\r
+ parseInt( 'AFEEEE', 16 ), 'PALETURQUOISE',\r
+ parseInt( '40E0D0', 16 ), 'TURQUOISE',\r
+ parseInt( 'E0FFFF', 16 ), 'LIGHTCYAN',\r
+ parseInt( '7FFFD4', 16 ), 'AQUAMARINE',\r
+ parseInt( '006400', 16 ), 'DARKGREEN',\r
+ parseInt( '2E8B57', 16 ), 'SEAGREEN',\r
+ parseInt( '90EE90', 16 ), 'LIGHTGREEN',\r
+ parseInt( '7FFF00', 16 ), 'CHARTREUSE',\r
+ parseInt( 'ADFF2F', 16 ), 'GREENYELLOW',\r
+ parseInt( '32CD32', 16 ), 'LIMEGREEN',\r
+ parseInt( '9ACD32', 16 ), 'YELLOWGREEN',\r
+ parseInt( '6B8E23', 16 ), 'OLIVEDRAB',\r
+ parseInt( 'BCB76B', 16 ), 'DARKKHAKI',\r
+ parseInt( 'EEE8AA', 16 ), 'PALEGOLDENROD',\r
+ parseInt( 'FFFFE0', 16 ), 'LIGHTYELLOW',\r
+ parseInt( 'FFD700', 16 ), 'GOLD',\r
+ parseInt( 'DAA520', 16 ), 'GOLDENROD',\r
+ parseInt( 'B8860B', 16 ), 'DARKGOLDENROD',\r
+ parseInt( 'BC8F8F', 16 ), 'ROSYBROWN',\r
+ parseInt( 'CD5C5C', 16 ), 'INDIANRED',\r
+ parseInt( '8B4513', 16 ), 'SADDLEBROWN',\r
+ parseInt( 'A0522D', 16 ), 'SIENNA',\r
+ parseInt( 'CD853F', 16 ), 'PERU',\r
+ parseInt( 'DEB887', 16 ), 'BURLYWOOD',\r
+ parseInt( 'F5F5DC', 16 ), 'BEIGE',\r
+ parseInt( 'F5DEB3', 16 ), 'WHEAT',\r
+ parseInt( 'F4A460', 16 ), 'SANDYBROWN',\r
+ parseInt( 'D2B48C', 16 ), 'TAN',\r
+ parseInt( 'D2691E', 16 ), 'CHOCOLATE',\r
+ parseInt( 'B22222', 16 ), 'FIREBRICK',\r
+ parseInt( 'A52A2A', 16 ), 'BROWN',\r
+ parseInt( 'FA8072', 16 ), 'SALMON',\r
+ parseInt( 'FFA500', 16 ), 'ORANGE',\r
+ parseInt( 'FF7F50', 16 ), 'CORAL',\r
+ parseInt( 'FF6347', 16 ), 'TOMATO',\r
+ parseInt( 'FF69B4', 16 ), 'HOTPINK',\r
+ parseInt( 'FFC0CB', 16 ), 'PINK',\r
+ parseInt( 'FF1493', 16 ), 'DEEPPINK',\r
+ parseInt( 'DB7093', 16 ), 'PALEVIOLETRED',\r
+ parseInt( 'EE82EE', 16 ), 'VIOLET',\r
+ parseInt( 'DDA0DD', 16 ), 'PLUM',\r
+ parseInt( 'DA70D6', 16 ), 'ORCHILD',\r
+ parseInt( '9400D3', 16 ), 'DARKVIOLET',\r
+ parseInt( '8A2BE2', 16 ), 'BLUEVIOLET',\r
+ parseInt( '9370DB', 16 ), 'MEDIUMPURPLE',\r
+ parseInt( 'D8BFD8', 16 ), 'THISTLE',\r
+ parseInt( 'E6E6FA', 16 ), 'LAVENDER',\r
+ parseInt( 'FFE4E1', 16 ), 'MISTYROSE',\r
+ parseInt( 'FFFFF0', 16 ), 'IVORY',\r
+ parseInt( 'FFFACD', 16 ), 'LEMONCHIFFON'\r
];\r
for( i=list.length; i; ){\r
v = list[ --i ];\r
return Math.abs( this._toPx() - prop._toPx() ) < 1;\r
},\r
convert: function( prop ){\r
- var u = prop.unit;\r
+ var u = prop.unit, v;\r
if( this.unit === u ) return;\r
- this.value = this._toPx();\r
+ this.value = v = this._toPx();\r
this.unit = u;\r
- if( u !== px ) this.value = Util.pxTo( this.value, u );\r
+ if( u !== px ){\r
+ this.value = u === 'em' ? v / this.pxPerEm : Util.pxTo( v, u );\r
+ };\r
},\r
setValue: function( v ){\r
this.value = v;\r
return true;\r
},\r
convert: function( prop ){\r
- if( this.pct === prop.pct ) return;\r
- var x = prop.pct === true ? 100 / 255 : 2.55;\r
+ var u = prop.pct;\r
+ if( this.pct === u ) return;\r
+ var x = u === true ? 100 / 255 : 2.55;\r
this.r *= x;\r
this.g *= x;\r
this.b *= x;\r
- this.pct = prop.pct;\r
+ this.pct = u;\r
},\r
setValue: function( rgb ){\r
this.r = rgb[ 0 ];\r
this.g = rgb[ 1 ];\r
- this.b = rgb[ 2 ]\r
+ this.b = rgb[ 2 ];\r
},\r
getValue: function(){\r
return [ this.r, this.g, this.b ];\r
},\r
getValueText: function(){\r
if( this.pct === true ){\r
- return [ 'rgb(', this.r, '% ', this.g, '% ', this.b, '%)' ].join( '' );\r
+ return [ 'rgb(', this.r, '%,', this.g, '%,', this.b, '%)' ].join( '' );\r
};\r
- var rgb = this.r * 255 * 255 + this.g * 256 + this.g;\r
- return '#' + rgb.toString( 16 );\r
+ var round = Math.round;\r
+ //return [ 'rgb(', round( this.r ), ',', round( this.g ), ',', round( this.b ), ')' ].join( '' );\r
+ \r
+ var rgb = '00000' + ( ( round( this.r ) << 16 ) + ( round( this.g ) << 8 ) + round( this.b ) ).toString( 16 );\r
+ return '#' + rgb.substr( rgb.length - 6 );\r
},\r
clear: function(){\r
var t = this, p;\r
return [ this.r / 2.55, this.g / 2.55, this.b / 2.55 ];\r
},\r
isValid: function( t ){\r
- return true;\r
+ var isFinite = window.isFinite;\r
+ if( !isFinite( this.r ) || !isFinite( this.g ) || !isFinite( this.b ) ) return false;\r
+ if( 0 > this.r || 0 > this.g || 0 > this.b ) return false;\r
+ if( this.pct === true ){\r
+ return this.r <= 100 && this.g <= 100 && this.b <= 100;\r
+ };\r
+ return this.r <= 255 && this.g <= 255 && this.b <= 255;\r
}\r
};\r
\r
isNumber = Type.isNumber;\r
var REG_UINIT = /.*\d(\w{1,2})?/,\r
$1 = '$1',\r
- px = 'px';\r
+ px = 'px',\r
+ REG_XXXXXX = /^#[\da-fA-F]{6}?/,\r
+ REG_XXX = /^#[\da-fA-F]{3}?/;\r
\r
- var WrappedStyleClass = function( elm, style ){\r
+ var WrappedStyleClass = function( elm, style, pxPerEm ){\r
this.elm = elm;\r
this.style = style;\r
- this.pxPerEm = this.get( 'fontSize' )._toPx;\r
+ this.pxPerEm = this.get( 'fontSize' )._toPx();\r
};\r
\r
WrappedStyleClass.prototype = {\r
};\r
var x = this.style[ p ], e, v, u;\r
if( PARAMS.offset[ p ] === true ){\r
+ return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x, p ), this.pxPerEm );\r
+ /*\r
e = this.elm;\r
if( p === 'width' ) v = e.offsetWidth;\r
if( p === 'height' ) v = e.offsetHeight;\r
if( p === 'bottom' ) v = e.offsetBottom;\r
if( p === 'left' ) v = e.offsetLeft;\r
if( p === 'right' ) v = e.offsetRight;\r
- u = this.getUnit( x );\r
- return new PropertyClass( p, this.pxTo( v, u ), u, this.pxPerEm );\r
+ u = this.getUnit( x, p );\r
+ // alert( p + this.pxTo( v, u ) + u )\r
+ return new PropertyClass( p, this.pxTo( v, u ), u, this.pxPerEm ); */\r
};\r
if( p === 'fontSize' ){ // xx-small 等\r
v = Util.absoluteFontSizeToPx( x );\r
};\r
}; \r
if( PARAMS.percent[ p ] === true ){\r
- return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x ), this.pxPerEm );\r
+ // alert( p + ' , ' + x + ' , ' + this.getUnit( x, p ) )\r
+ return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x, p ), this.pxPerEm );\r
};\r
if( PARAMS.size[ p ] === true ){\r
- return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x ), this.pxPerEm );\r
+ return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x, p ), this.pxPerEm );\r
};\r
if( PARAMS.color[ p ] === true ){\r
return this.getColor( x, p );\r
},\r
pxTo: function( px, unit ){\r
if( unit === 'em' ) return px / this.pxPerEm;\r
- Util.pxTo( px, unit );\r
+ return Util.pxTo( px, unit );\r
},\r
getValue: function( x, p ){\r
if( isString( x ) === true ){\r
};\r
return 0;\r
},\r
- getUnit: function( x ){\r
- var u = px;\r
+ getUnit: function( x, p ){\r
+ var u;\r
if( isString( x ) === true ){\r
u = x.replace( REG_UINIT, $1 );\r
- if( PARAMS.unit[ u ] === false ) return '';\r
+ if( p === 'lineHeight' ) return u;\r
+ if( PARAMS.unit[ u ] !== true ) return px;\r
+ return u;\r
};\r
- return u;\r
+ return px;\r
},\r
getColor: function( x, p ){\r
var rgb = COLOR[ x.toUpperCase() ],\r
g = ( rgb & 0xff00 ) >> 8;\r
b = ( rgb & 0xff );\r
} else\r
- if( x.match( /^#[\da-fA-F]{3}?/ ) ){\r
- r = parseFloat( x.cahrAt( 1 ) + x.cahrAt( 1 ), 16 );\r
- g = parseFloat( x.cahrAt( 2 ) + x.cahrAt( 2 ), 16 );\r
- b = parseFloat( x.cahrAt( 3 ) + x.cahrAt( 3 ), 16 );\r
- } else\r
- if( x.match( /^#[\da-fA-F]{6}?/ ) ){\r
- r = parseFloat( x.cahrAt( 1 ) + x.cahrAt( 2 ), 16 );\r
- g = parseFloat( x.cahrAt( 3 ) + x.cahrAt( 4 ), 16 );\r
- b = parseFloat( x.cahrAt( 5 ) + x.cahrAt( 6 ), 16 );\r
+ if( x.match( REG_XXXXXX ) ){\r
+ r = parseInt( x.charAt( 1 ) + x.charAt( 2 ), 16 );\r
+ g = parseInt( x.charAt( 3 ) + x.charAt( 4 ), 16 );\r
+ b = parseInt( x.charAt( 5 ) + x.charAt( 6 ), 16 );\r
+ //alert( x + ' g: ' + g )\r
+ } else \r
+ if( x.match( REG_XXX ) ){\r
+ r = parseInt( x.charAt( 1 ) + x.charAt( 1 ), 16 );\r
+ g = parseInt( x.charAt( 2 ) + x.charAt( 2 ), 16 );\r
+ b = parseInt( x.charAt( 3 ) + x.charAt( 3 ), 16 );\r
} else\r
if( x.indexOf( 'rgb(' ) === 0 ){\r
rgb = x.substr( 4 ).split( ',' );\r
g = parseFloat( rgb[ 1 ] );\r
b = parseFloat( rgb[ 2 ] );\r
if( x.indexOf( '%' ) !== -1 ){\r
- r *= 2.56;\r
- g *= 2.56;\r
- b *= 2.56;\r
pct = true;\r
};\r
+ } else {\r
+ r = 255;\r
+ g = 255;\r
+ b = 255;\r
};\r
return new ColorPropertyClass( p, r, g, b, pct );\r
},\r
};\r
}\r
};\r
+ function camelizeHash( obj ){\r
+ var p, _p;\r
+ for( p in obj ){\r
+ _p = Util.camelize( p );\r
+ if( _p === p ) continue;\r
+ obj[ _p ] = obj[ _p ] || obj[ p ];\r
+ delete obj[ p ];\r
+ };\r
+ };\r
\r
return {\r
- getWrappedStyle: function( elm, css ){\r
- return new WrappedStyleClass( elm, css || CSS.getComputedStyle( elm ) );\r
+ getWrappedStyle: function( elm, opt_css ){\r
+ opt_css && camelizeHash( opt_css );\r
+ return new WrappedStyleClass( elm, opt_css || CSS.getComputedStyle( elm ) );\r
},\r
getInlineStyle: function( _elm ){\r
return cssToObject( _elm.style.cssText );\r
if( PARAMS.borderWidth[ p ] === true && _css.borderWidth ) continue;\r
if( PARAMS.borderColor[ p ] === true && _css.borderColor ) continue;\r
v = _css[ p ];\r
- v && ret.push( [ p, v ].join( ':' ) );\r
+ v && ret.push( [ Util.uncamelize( p ), v ].join( ':' ) );\r
};\r
return ret.join( ';' );\r
}\r
}\r
for( var key in src ){\r
if( Util.getIndex( protects, key ) === -1 ){\r
- //alert( key )\r
ret[ key ] = clone( src[ key ]);\r
}\r
}\r
_class.prototype = new AbstractBasicPane();\r
return new _class( _options );\r
};\r
+ this.createDHTML = function( _elm ){\r
+ return DHTML.create( self, _elm );\r
+ };\r
this.fetchCSS = function( _url, opt_onload, opt_onerror ){\r
if( phase === 1 ){\r
++fetchResource;\r
var self = this;\r
\r
this.bgColor = '#ffffff';\r
- this.MIN_WIDTH = 320;\r
- this.MIN_HEIGHT = 320;\r
+ this.MIN_WIDTH = 200;\r
+ this.MIN_HEIGHT = 200;\r
this.onInit = function(){};\r
this.onOpen = function( _w, _h ){\r
KeyEvent.add( self, Const.KEY.EVENT.KEY_DOWN, ref.shutdown, 27 ); // 27.esc\r
* \r
* clientX\r
* ウインドウ座標とは、現在のブラウザのウインドウの、ドキュメントを表示している部分の左上原点とした座標である。\r
- * 問題は、ウインドウは、必ずしもドキュメント全体を表示するとは限らない。スクロールと呼ばれるUIによって、ドキュメントの一部だけを表示しているかもしれない。
+ * 問題は、ウインドウは、必ずしもドキュメント全体を表示するとは限らない。スクロールと呼ばれるUIによって、ドキュメントの一部だけを表示しているかもしれない。\r
*/\r
var XBrowserEvent = ( function(){\r
var wrappedHandlerClass,\r
\r
/* =====================================================\r
* MouseEvent\r
- *
+ * \r
*/\r
var MouseEvent = ( function(){\r
var CLICK_OFFSET = 2 * 2; \r
/*\r
* currentListener\r
* currrentApplication ( overlay Application ) or\r
- * superuser ( UI )
+ * superuser ( UI )\r
*/\r
updateCurrentListener: function( _apiuser ){\r
application = _apiuser;\r
\r
/**\r
* \r
- * http://thudjs.tumblr.com/post/637855087/stylesheet-onload-or-lack-thereof
+ * http://thudjs.tumblr.com/post/637855087/stylesheet-onload-or-lack-thereof\r
*/\r
\r
var Css = ( function(){\r
\r
\r
/* ----------------------------------------\r
- *
+ * \r
*/\r
\r
var Overlay = ( function(){\r
* backgroundPosition (len, %)\r
* opacity\r
* lineHeight (len, %, num)\r
- * zIndex ( order )
+ * zIndex ( order )\r
*/\r
\r
var DHTML = ( function(){\r
\r
var ANIMATION_TICKET_ARRAY = [],\r
- fpms = 50;\r
+ fpms = 50,\r
+ round = Math.round,\r
+ cround = function ( v ){ return round( v * 100 ) / 100 };\r
\r
function startAnimation( _elm, _cssObject, _onComplete, _onEnterFrame, _numFrames ){\r
var _ticket, i = ANIMATION_TICKET_ARRAY.length;\r
for( ; i; ){\r
_ticket = ANIMATION_TICKET_ARRAY[ --i ];\r
if( _ticket.elm === _elm ){\r
- _ticket.destroy();\r
- break;\r
+ return;\r
};\r
};\r
\r
inlineStyle = CSS.getInlineStyle( _elm ),\r
currentStyle = CSS.getWrappedStyle( _elm ),\r
targetStyle = CSS.getWrappedStyle( _elm, _cssObject );\r
- for( var p in _cssObject ){ \r
+ targetStyle.pxPerEm = currentStyle.get( 'fontSize' )._toPx();\r
+ for( var p in _cssObject ){\r
+ p = Util.camelize( p );\r
target = targetStyle.get( p );\r
current = currentStyle.get( p );\r
+\r
if( target.isValid() === false || current.isValid() === false || current.equal( target ) !== false ){\r
target.clear();\r
current.clear();\r
continue;\r
};\r
- current.convert( target );\r
\r
+ current.convert( target );\r
+ // alert( current.getValue() + ' , ' + target.getValue() )\r
_currentValues.push( current.getValue() );\r
_offsetValues.push( current.getOffset( target ) );\r
_endValues.push( target.getValue() );\r
_targetProperties.push( p );\r
_units.push( target.getUnit() );\r
- \r
+\r
// IE has trouble with opacity if it does not have layout\r
// Force it by setting the zoom level \r
if( p === 'opacity' && SPECIAL.hasLayout ){\r
current.clear();\r
};\r
\r
- currentStyle.clear();\r
- targetStyle.clear();\r
+ var i, _cssTextArray = [];\r
+ for( i = 0; i < _numFrames; ++i ){\r
+ if( i < _numFrames - 1 ){\r
+ tickValue( _currentValues, _offsetValues, _numFrames );\r
+ createCssText( _currentValues, _targetProperties, targetStyle, inlineStyle, _cssTextArray );\r
+ } else {\r
+ createCssText( _endValues, _targetProperties, targetStyle, inlineStyle, _cssTextArray );\r
+ };\r
+ };\r
\r
ANIMATION_TICKET_ARRAY.push( new AnimationTaskClass(\r
- elm, inlineStyle,\r
- _currentValues, _offsetValues, _endValues, _targetProperties, _units,\r
+ _elm, _cssTextArray,\r
Type.isFunction( _onComplete ) === true ? _onComplete : null,\r
Type.isFunction( _onEnterFrame ) === true ? _onEnterFrame : null,\r
_numFrames\r
) );\r
\r
+ currentStyle.clear();\r
+ targetStyle.clear(); \r
SystemTimer.add( SUPER_USER_KEY, onEnterFrame, 1000 / fpms );\r
};\r
\r
+ function tickValue( current, offset, numFrames ){\r
+ if( Type.isArray( current ) === true ){\r
+ var ret, i = current.length;\r
+ for( ; i; ){\r
+ --i;\r
+ ret = tickValue( current[ i ], offset[ i ], numFrames );\r
+ if( Type.isNumber( ret ) === true ) current[ i ] = ret;\r
+ };\r
+ } else {\r
+ return current + offset / numFrames;\r
+ };\r
+ };\r
+ function createCssText( update, props, style, inline, cssTextArray ){\r
+ var prop;\r
+ for( var i = props.length; i; ){\r
+ prop = style.get( props[ --i ] );\r
+ prop.setValue( update[ i ] );\r
+ inline[ Util.uncamelize( prop.name ) ] = prop.getValueText();\r
+ //if( prop.name === 'backgroundColor' ) alert( prop.getValueText() + '|' + update[ i ].join( ',') )\r
+ prop.clear();\r
+ };\r
+ cssTextArray.push( CSS.toCssText( inline ) );\r
+ };\r
+ \r
function onEnterFrame(){\r
- var _ticket,\r
+ var _ticket, l,\r
i = 0;\r
while( i < ANIMATION_TICKET_ARRAY.length ){\r
_ticket = ANIMATION_TICKET_ARRAY[ i ];\r
- if( _ticket.onEnterFrame() === true ){\r
+ l = _ticket.cssTexts.length;\r
+ _ticket.elm.style.cssText = _ticket.cssTexts.shift();\r
+ if( l === 1 ){\r
+ _ticket.onComplete && _ticket.onComplete();\r
+ delete _ticket.elm;\r
+ delete _ticket.cssTexts;\r
+ delete _ticket.onComplete;\r
+ delete _ticket.onEnterFrame;\r
+ delete _ticket.numFrame;\r
ANIMATION_TICKET_ARRAY.splice( i, 1 );\r
} else {\r
+ _ticket.onEnterFrame && _ticket.onEnterFrame( l / _ticket.numFrame );\r
++i;\r
};\r
};\r
};\r
};\r
\r
- var AnimationTaskClass = function( elm, inlineStyle, currentValues, offsetValues, endValues, properties, units, onComplete, onEnterFrame, numFrames ){\r
- this.elm = elm;\r
- this.inlineStyle = inlineStyle;\r
- this.style = CSS.getWrappedStyle( elm, inlineStyle );\r
- this.currentValues = currentValues;\r
- this.offsetValues = offsetValues;\r
- this.endValues = endValues;\r
- this.properties = properties;\r
- this.units = units;\r
- this.onComplete = onComplete;\r
- this.onEnterFrame = onEnterFrame;\r
- this.numFrames = numFrames;\r
- this.count = 0;\r
+ var AnimationTaskClass = function( elm, cssTexts, onEnterFrame, onComplete, numFrame ){\r
+ this.elm = elm;\r
+ this.cssTexts = cssTexts;\r
+ this.onEnterFrame = onEnterFrame;\r
+ this.onComplete = onComplete;\r
+ this.numFrame = numFrame;\r
};\r
- AnimationTaskClass.prototype = {\r
- onEnterFrame: function(){\r
- if( this.count < this.numFrams ){\r
- this._setOffset( this.currentValues, this.offsetValues );\r
- this._update( this.currentValues );\r
- this.onEnterFrame && this.onEnterFrame( this.count / this.numFrams );\r
- ++this.count;\r
- return false;\r
- };\r
- this._update( this.endValues );\r
- this.onComplete && this.onComplete();\r
- this.style.clear();\r
- \r
- return true;\r
- },\r
- _setOffset: function( current, offset ){\r
- if( Type.isArray( current ) === true ){\r
- var ret, i = current.length;\r
- for( ; i; ){\r
- --i;\r
- ret = this._setOffset( current[ i ], offset[ i ] );\r
- if( Type.isNumber( ret ) === true ) current[ i ] = ret;\r
- };\r
- } else {\r
- return current += offset / this.numFrames;\r
- };\r
- },\r
- _update: function( update ){\r
- var props = this.properties, prop,\r
- inline = this.inlineStyle,\r
- style = this.style;\r
- for( var i = props.length; i; ){\r
- prop = style.get( props[ --i ] );\r
- prop.setValue( update[ i ] );\r
- inline[ prop.name ] = prop.getValueText();\r
- prop.clear();\r
- };\r
- this.elm.style.cssText = CSS.toCssText( inline );\r
- }\r
- }\r
\r
var VisualEffectClass = function( elm ){\r
var isHtmlElement;\r
};\r
\r
return {\r
- createVisualEffect: function( _elm ){\r
+ create: function( application, _elm ){\r
return new VisualEffectClass( _elm );\r
},\r
isInstanceOfVisualEffect: function( _instance){\r
\r
\r
/* --------------------------------------------\r
- *
+ * \r
*/\r
\r
Application.onCurrentApplicationChange( SUPER_USER_KEY );\r
\r
\r
/* ---------------------------------------------\r
- * broadcast to global
+ * broadcast to global\r
*/\r
window.gOS = {};\r
\r