16 if( !( 'console' in window ) ){
\r
17 window[ 'console' ] = { log : function(){} };
\r
20 var getFunctionName = function( f ){
\r
23 : (''+f).replace(/^\s*function\s*([^\(]*)[\S\s]+$/im, '$1');
\r
27 * http://d.hatena.ne.jp/hir90/20080620/1213987444
\r
29 String.prototype.repeat = function( num){
\r
30 var str = "" + this;
\r
32 if( num < 0) return 'error';
\r
34 if( num&1) ans += str;
\r
42 * http://pettanr.sourceforge.jp/test/type.html
\r
45 isObject : function(v) {
\r
46 return v !== null && typeof v === 'object';
\r
48 isFunction : function(v) {
\r
49 return typeof v === 'function';
\r
51 isArray : function(v) {
\r
52 return Object.prototype.toString.call(v) === '[object Array]';
\r
54 isBoolean : function(v) {
\r
55 return typeof v === 'boolean';
\r
57 isString : function(v) {
\r
58 return typeof v === 'string';
\r
60 isNumber : function(v) {
\r
61 return typeof v === 'number';
\r
63 isFinite : function(v){
\r
64 return Type.isNumber(v) === true && isFinite(v);
\r
66 isHTMLElement : function(v){
\r
67 if( 'HTMLElement' in window ){
\r
68 Type.isHTMLElement = function(v){
\r
69 return v instanceof HTMLElement;
\r
72 Type.isHTMLElement = function(v) {
\r
73 if( Type.isObject(v) === false ){
\r
77 if(v && v.nodeType === 1 ){
\r
79 r = v.cloneNode(false);
\r
83 if(r === v) return false;
\r
86 return r.nodeType === 1;
\r
93 return Type.isHTMLElement(v);
\r
96 isElementCollection : function(v) {
\r
97 return (Object.prototype.toString.call(v) === "[object HTMLCollection]");
\r
100 isNull : function(v) {
\r
103 isUndefined : function(v) {
\r
104 return typeof v === 'undefined';
\r
114 var UA = ( function(){
\r
115 var ua = (function(){
\r
119 var dua = n.userAgent;
\r
120 var dav = n.appVersion;
\r
121 var tv = parseFloat(dav);
\r
122 acme.isOpera = (dua.indexOf("Opera") >= 0) ? tv: undefined;
\r
123 acme.isKhtml = (dav.indexOf("Konqueror") >= 0) ? tv : undefined;
\r
124 acme.isWebKit = parseFloat(dua.split("WebKit\/")[1]) || undefined;
\r
125 acme.isChrome = parseFloat(dua.split("Chrome\/")[1]) || undefined;
\r
126 acme.isGecko = (dua.indexOf("Gecko\/") >= 0) ? parseFloat(dua.split("rv:")[1].replace( /^(\d*\.\d*)\.(\d*)/, '$1$2' )) : undefined;
\r
127 var index = Math.max(dav.indexOf("WebKit"), dav.indexOf("Safari"), 0);
\r
128 if(index && !acme.isChrome){
\r
129 acme.isSafari = parseFloat(dav.split("Version/")[1]);
\r
130 if(!acme.isSafari || parseFloat(dav.substr(index + 7)) <= 419.3){
\r
134 if(document.all && !acme.isOpera){
\r
135 acme.isIE = parseFloat(dav.split("MSIE ")[1]) || undefined;
\r
140 isIE = navigator.userAgent.toLowerCase().indexOf( 'msie') !== -1,
\r
141 ieVersion = isIE === true ? parseInt( navigator.appVersion.toLowerCase().replace( /.*msie[ ]/, '').match( /^[0-9]+/)) : 0,
\r
142 ieRenderingVersion = ieVersion === 8 ? document.documentMode : ieVersion,
\r
143 isStanderdMode = document.compatMode === 'CSS1Compat',
\r
144 ActiveX = ( function(){
\r
145 if( isIE === false || ieVersion > 8 ) return false;
\r
146 var b = document.body,
\r
147 c = b.className || '',
\r
149 ret = undefined, //pettanr.URL_PARAMS.ActiveX,
\r
150 ns = 'pettanr-ActiveX-',
\r
151 enabled = 'enabled',
\r
152 disabled = 'disabled';
\r
153 if( ret !== true && ret !== false){
\r
154 if( b.className.indexOf( ns + enabled ) !== -1 ) return true;
\r
155 if( b.className.indexOf( ns + disabled ) !== -1 ) return false;
\r
156 x = document.createElement( 'div' );
\r
158 x.style.cssText = 'width:1px;height:1px;line-height:1px;filter:progid:DXImageTransform.Microsoft.Shadow()';
\r
159 ret = x.offsetHeight > 1;
\r
162 b.className += [ c !== '' ? ' ' : c, ns, ret === true ? enabled : disabled ].join( '');
\r
165 VML = ( function(){
\r
166 if( ActiveX === false || isIE === false || ieVersion > 8) return false;
\r
167 var globalObjectName = 'detect_activex',//Util.createGlobalUniqueName(),
\r
170 document.write( [ '<!--[if gte vml 1]><script id="', id, '">window', '.', globalObjectName, '=1;<\/script><![endif]-->'].join( ''));
\r
171 if( window[ globalObjectName ] === 1 ){
\r
172 script = document.getElementById( id );
\r
173 script.parentNode.removeChild( script );
\r
174 window[ globalObjectName ] = null;
\r
179 isStandAloneMode = ( function(){
\r
180 if( isIE === false) return false;
\r
181 if( VML === true) return false;
\r
182 var globalObjectName = 'detect_standalone', //Util.createGlobalUniqueName(),
\r
184 id = 'detectStandAlone';
\r
185 document.write( [ '<!--[if IE ', Math.floor( ieVersion ), ']><script id="', id, '">window', '.', globalObjectName, '=1;<\/script><![endif]-->'].join( '' ));
\r
186 if( window[globalObjectName] === 1 ){
\r
187 script = document.getElementById( id);
\r
188 script.parentNode.removeChild( script);
\r
189 window[globalObjectName] = null;
\r
199 WEBKIT: ua.isWebKit,
\r
200 CHROME: ua.isChrome,
\r
202 ieVersion: ieVersion,
\r
203 ieRenderingVersion: ieRenderingVersion,
\r
204 isStanderdMode: isStanderdMode,
\r
207 STANDALONE: isStandAloneMode,
\r
208 VENDER_PREFIX: ( function() {
\r
209 var ua = navigator.userAgent.toLowerCase();
\r
210 if ( ua.indexOf('opera') !== -1 ){
\r
212 } else if ( ua.indexOf('msie') !== -1 ){
\r
214 } else if ( ua.indexOf('webkit') !== -1 ){
\r
216 } else if ( navigator.product === 'Gecko' ){
\r
221 startVML: function(){
\r
222 delete UA.startVML;
\r
223 if( UA.VML !== true) return false;
\r
224 if (!document.namespaces["v"]) {
\r
225 document.namespaces.add("v", "urn:schemas-microsoft-com:vml", "#default#VML");
\r
227 document.createStyleSheet().cssText = "v\:shape,v\:image{behavior:url(#default#VML);display:block;};";
\r
233 /* ----------------------------------------------------
\r
236 * extend( baseInstance, extend)
\r
237 * cleanCommentNode()
\r
239 * getElementSize( _elm)
\r
241 * getAbsolutePath()
\r
242 * getGrobalObjectName()
\r
245 var Util = ( function( window, document, undefined ){
\r
246 var body = document.getElementsByTagName( 'body' )[ 0 ];
\r
248 var ELM_SIZE_GETTER = ( function(){
\r
249 var ret = document.createElement( 'div' );
\r
250 body.appendChild( ret );
\r
252 ret.id = 'elmSizeGetter';
\r
253 ret.style.cssText = 'position:absolute;left:0;top:-9999px;visibility:hidden';
\r
255 body.removeChild( ret );
\r
258 CLEAN_TARGET_ELEMENT = 'script,style,object,applet,embed,iframe,frame,base,bgsound,frameset,listing'.split( ',' );
\r
260 var UNIT_RATIO = ( function( elm ){
\r
263 units = 'cm,mm,in,pt,pc'.split( ',' );
\r
265 body.appendChild( elm );
\r
267 for( var i=units.length; i; ){
\r
268 unit = units[ --i ];
\r
269 elm.style.width = 1000 + unit;
\r
270 ret[ unit ] = elm.offsetWidth / 1000;
\r
272 elm.style.cssText = '';
\r
274 body.removeChild( elm );
\r
276 })( ELM_SIZE_GETTER );
\r
278 var FONT_SIZE_RATIO = ( function( elm ){
\r
281 list = 'xx-large,x-large,large,larger,medium,small,smaller,x-small,xx-small'.split( ',' );
\r
283 body.appendChild( elm );
\r
284 elm.style.cssText = 'font-size:100px;line-height:1em;';
\r
285 elm.appendChild( document.createTextNode( 'X' ) );
\r
287 base = elm.offsetHeight;
\r
289 for( var i = list.length; i; ){
\r
290 size = list[ --i ];
\r
291 elm.style.fontSize = size;
\r
292 ret[ size ] = elm.offsetHeight;// / base;
\r
295 elm.style.cssText = '';
\r
296 elm.removeChild( elm.firstChild );
\r
297 body.removeChild( elm );
\r
299 })( ELM_SIZE_GETTER );
\r
301 var REG_LARGE = /[A-Z]/g;
\r
303 /* clean comment node */
\r
304 window.setTimeout( function(){
\r
305 Util.cleanCommentNode();
\r
307 /* clean noscript */
\r
309 var noscripts = Util.copyArray( document.getElementsByTagName( 'noscript' ) ),
\r
311 for( var i = noscripts.length; i; ){
\r
312 ns = noscripts[ --i ];
\r
313 ns.parentNode && ns.parentNode.removeChild( ns );
\r
317 function clone( src ) {
\r
319 if( Type.isArray(src) === true ){
\r
322 if( Type.isObject(src) === true ){
\r
325 if( Type.isNumber(src) === true || Type.isString(src) === true || Type.isBoolean( src ) === true ){
\r
330 for( var key in src ){
\r
331 ret[ key ] = clone( src[ key ]);
\r
337 parse: function( v ){
\r
338 if( Type.isString( v ) === true ){
\r
339 if( v === 'true' ) return true;
\r
340 if( v === 'false' ) return false;
\r
341 if( v === 'null' ) return null;
\r
342 if( v === 'undefined' ) return undefined;
\r
343 if( v === 'NaN' ) return NaN;
\r
344 if( v === '' ) return v;
\r
345 var _v = v.split( ' ' ).join( '' ),
\r
347 if( '' + n === _v || '' + n === '0' + _v ) return n - 0;
\r
351 extend: function( target, extend ){
\r
352 for( var key in extend ){
\r
353 if( Type.isUndefined( target[ key ] ) === true ){
\r
354 target[ key ] = extend[ key ];
\r
356 if( typeof target[ key ] === typeof extend[ key ] ){
\r
357 target[ key ] = extend[ key ];
\r
359 alert( 'extend error' );
\r
364 copy: function( objOrArray ){
\r
365 return clone( objOrArray );
\r
367 cleanCommentNode: function ( _targetElm ){
\r
368 search( _targetElm || body );
\r
370 function search( _elm ){
\r
371 if( !_elm ) return;
\r
372 if( _elm.nodeType === 8 ){
\r
373 _elm.parentNode.removeChild( _elm );
\r
376 if( _elm.nodeType === 1 ){
\r
377 var _array = Util.copyArray( _elm.childNodes ); // liveNode > array
\r
378 while( _array.length > 0 ) search( _array.shift() );
\r
382 cleanElement: function( _targetElm ){
\r
383 var _array, _elm, j, _css;
\r
384 for( var i = CLEAN_TARGET_ELEMENT.length; i; ){
\r
385 _array = Util.copyArray( _targetElm.getElementsByTagName( CLEAN_TARGET_ELEMENT[ --i ] ) );
\r
386 for( j = _array.length; j; ){
\r
387 _elm = _nodes[ --j ];
\r
388 _elm.parentNode && _elm.parentNode.removeChild( _elm );
\r
391 Util.cleanCommentNode( _targetElm );
\r
393 if( UA.isIE === false ) return;
\r
394 _nodes = _targetElm.all || _targetElm.getElementsByTagName( '*' );
\r
395 for( i = _nodes.length; i; ){
\r
396 _elm = _nodes[ --i ];
\r
397 _css = Util.getInlineStyle( _elm );
\r
398 _css.filter = null;
\r
399 _css.behavior = null;
\r
400 _elm.style.cssText = Util.toCssText( _css );
\r
403 camelize: function( cssProp ){
\r
404 var parts = cssProp.split( ' ' ).join( '' ).split( '-' ),
\r
406 if( l === 1 ) return parts[ 0 ];
\r
408 var camelized = cssProp.charAt(0) === '-'
\r
409 ? parts[ 0 ].charAt( 0 ).toUpperCase() + parts[ 0 ].substring( 1 )
\r
412 for( var i = 1; i < l; ++i ){
\r
413 camelized += parts[ i ].charAt( 0 ).toUpperCase() + parts[ i ].substring( 1 );
\r
417 uncamelize: function( str ){
\r
418 return str.split( ' ' ).join( '' ).replace( REG_LARGE, '-$&' ).toLowerCase();
\r
420 pxTo: function( _px, _unit ){
\r
421 return _px / ( UNIT_RATIO[ _unit ] || 1 );
\r
423 toPx: function( x, _unit ){
\r
424 return x * ( UNIT_RATIO[ _unit ] || 1 );
\r
426 absoluteFontSizeToPx: function( fontsize ){
\r
427 return FONT_SIZE_RATIO[ fontsize ] || 0;
\r
429 getElementSize: function( _elm ){
\r
430 if( Type.isHTMLElement( _elm ) === false ){
\r
436 var parentElm = _elm.parentNode,
\r
437 prevElm = _elm.previousSibling,
\r
438 nextElm = _elm.nextSibling,
\r
439 displayNone = _elm.style.display === 'none';
\r
440 if( displayNone === true ) _elm.style.display = 'block';
\r
442 body.appendChild( ELM_SIZE_GETTER );
\r
443 ELM_SIZE_GETTER.appendChild( _elm );
\r
446 width: _elm.offsetWidth,
\r
447 height: _elm.offsetHeight
\r
449 if( displayNone === true ) _elm.style.display = 'none';
\r
451 parentElm.insertBefore( _elm, nextElm );
\r
453 if( prevElm && prevElm.nextSibling ){
\r
454 parentElm.insertBefore( _elm, prevElm.nextSibling );
\r
456 parentElm && parentElm.appendChild( _elm );
\r
458 body.removeChild( ELM_SIZE_GETTER );
\r
462 getImageSize: function( img ){
\r
463 var parentElm = img.parentNode,
\r
464 prevElm = img.previousSibling,
\r
465 nextElm = img.nextSibling,
\r
466 displayNone = img.style.display === 'none';
\r
467 if( displayNone === true ) img.style.display = '';
\r
469 body.appendChild( ELM_SIZE_GETTER );
\r
470 ELM_SIZE_GETTER.appendChild( img );
\r
472 var size = getActualDimension( img );
\r
474 if( displayNone === true ) img.style.display = 'none';
\r
476 parentElm.insertBefore( img, nextElm );
\r
478 if( prevElm && prevElm.nextSibling ){
\r
479 parentElm.insertBefore( img, prevElm.nextSibling );
\r
481 parentElm && parentElm.appendChild( img );
\r
483 body.removeChild( ELM_SIZE_GETTER );
\r
486 * AUTHOR: uupaa.js@gmail.com
\r
488 function getActualDimension(image) {
\r
489 var run, mem, w, h, key = "actual";
\r
491 // for Firefox, Safari, Google Chrome
\r
492 if( "naturalWidth" in image ){
\r
494 width: image.naturalWidth,
\r
495 height: image.naturalHeight
\r
499 if( "src" in image ){ // HTMLImageElement
\r
500 if (image[key] && image[key].src === image.src) {
\r
503 if( document.uniqueID ){ // for IE
\r
504 run = image.runtimeStyle;
\r
505 mem = { w: run.width, h: run.height }; // keep runtimeStyle
\r
506 run.width = "auto"; // override
\r
507 run.height = "auto";
\r
510 run.width = mem.w; // restore
\r
511 run.height = mem.h;
\r
512 } else { // for Opera and Other
\r
513 mem = { w: image.width, h: image.height }; // keep current style
\r
514 image.removeAttribute("width");
\r
515 image.removeAttribute("height");
\r
518 image.width = mem.w; // restore
\r
519 image.height = mem.h;
\r
521 return image[key] = { width: w, height: h, src: image.src }; // bond
\r
523 // HTMLCanvasElement
\r
524 return { width: image.width, height: image.height };
\r
529 getAbsolutePath: function( path ){
\r
530 var elm = document.createElement('div');
\r
531 body.appendChild( elm );
\r
532 elm.innerHTML = '<a href=\"' + path + '\" />';
\r
533 body.removeChild( elm );
\r
534 return elm.firstChild.href;
\r
536 getAbsolutePosition: function( _elm ){
\r
537 // Find the destination's position
\r
538 // need html, body { fontfamily: "MS PGothic", "MS Gothic" } for ie6.
\r
539 var destx = _elm.offsetLeft,
\r
540 desty = _elm.offsetTop,
\r
542 body = document.body;
\r
543 while( thisNode.offsetParent && thisNode !== body ){
\r
544 thisNode = thisNode.offsetParent;
\r
545 destx += thisNode.offsetLeft;
\r
546 desty += thisNode.offsetTop;
\r
553 contain: function( parent, child ){
\r
554 function find( node ){
\r
555 var children = node.childNodes,
\r
557 l = children.length,
\r
560 elm = children[ i ];
\r
561 if( elm === child ) return true;
\r
562 if( elm.nodeType === 1 && find( elm ) === true ) return true;
\r
566 return find( parent );
\r
568 pullHtmlAsTemplete: function( html ){
\r
569 var elm = document.createElement( 'div' );
\r
570 body.appendChild( elm );
\r
571 elm.innerHTML = html;
\r
572 body.removeChild( elm );
\r
573 return elm.firstChild;
\r
575 getElementsByClassName: function( _elm, _className, opt_tagName ){
\r
576 var _all = !opt_tagName || opt_tagName === '*',
\r
577 _livenodes = _all === true ? ( _elm.all || _elm.getElementsByTagName( '*' )) : _elm.getElementsByTagName( opt_tagName ),
\r
578 _nodes = Util.copyArray( _livenodes );
\r
579 for( var j = 0; j < _nodes.length; ){
\r
580 _node = _nodes[ j ];
\r
581 if( _node.nodeType !== 1 || Util.hasClassName( _node, _className ) === false ){
\r
582 _nodes.splice( j, 1 );
\r
589 getChildIndex: function( _parent, _child ){
\r
590 var _children = _parent.getElementsByTagName( _child.tagName );
\r
591 for( var i = _children.length; i; ){
\r
592 if( _children[ --i ] === _child ) return i;
\r
596 hasClassName: function( _elm, _className ){
\r
597 var cnames = ( _elm.className || '' ).split( ' ' ),
\r
598 _cnames = _className.split( ' ' ),
\r
600 for( var i = _cnames.length; i; ){
\r
601 cname = _cnames[ --i ];
\r
602 if( cname === '' ) continue;
\r
603 if( Util.getIndex( cnames, cname ) === -1 ) return false;
\r
607 addClass: function( _elm, _className ){
\r
608 if( Util.hasClassName( _elm, _className ) === false ){
\r
610 var _array = ( _elm.className || '' ).replace( /\s+/g, sp ).split( sp );
\r
611 _array.push( _className );
\r
612 _elm.className = _array.join( sp );
\r
615 removeClass: function( _elm, _className ){
\r
617 _array = _elm.className.replace( /\s+/g, sp ).split( sp ),
\r
618 i = Util.getIndex( _array, _className );
\r
620 _array.splice( i, 1 );
\r
621 _elm.className = _array.join( sp );
\r
624 toggleClass: function( _elm, _className, _switch ){
\r
625 if( Type.isBoolean( _switch ) === true ){
\r
626 _switch === true ? Util.addClass( _elm, _className ) : Util.removeClass( _elm, _className );
\r
628 Util.hasClassName( _elm, _className ) === false ? Util.addClass( _elm, _className ) : Util.removeClass( _elm, _className );
\r
631 removeAllChildren: function ( _elm ){
\r
632 while( _elm.firstChild ){
\r
633 remove( _elm.firstChild );
\r
635 function remove( _node ){
\r
636 while( _node.firstChild){
\r
637 remove( _node.firstChild);
\r
639 _node.parentNode && _node.parentNode.removeChild( _node);
\r
642 getIndex: function( _array, _element ){
\r
643 if( Array.prototype.indexof ){
\r
644 Util.getIndex = function( _array, _element ){
\r
645 return _array.indexof( _element );
\r
648 Util.getIndex = function( _array, _element ){
\r
649 for( var i = _array.length; i; ){
\r
650 if( _array[ --i ] === _element ) return i;
\r
655 return Util.getIndex( _array, _element );
\r
657 copyArray: function( _array ){
\r
658 var l = _array.length,
\r
659 ret = new Array( l );
\r
660 for( var i=0; i<l; ++i ){
\r
661 ret[ i ] = _array[ i ];
\r
668 createGlobalUniqueName: function(){
\r
669 var randomKey = null;
\r
671 randomKey = '_uniqueName'+(''+Math.random()).replace(/\./,'');
\r
672 if( typeof window[randomKey] === 'undefined'){
\r
678 createIframe: function( id, callback, hide ){
\r
680 var el = document.createElement( ua.isIE ? '<iframe name="' + id + '" frameborder="0" scrolling="no">' : 'iframe');
\r
683 el.onreadystatechange = function(){
\r
684 if( this.readyState === "complete" ){
\r
685 this.onreadystatechange = new Function();
\r
686 this.onreadystatechange = null;
\r
687 setTimeout( asynkCallback, 0 );
\r
691 // iron(chrome) の場合、append の前に onload を指定しないと onload が呼ばれない
\r
692 el.onload = function(){
\r
694 setTimeout( asynkCallback, 0 );
\r
698 document.body.appendChild( el );
\r
699 el.id = el.name = id;
\r
700 el.setAttribute( 'name', id );
\r
701 if( hide === true )el.style.cssText = 'width:1px;height:1px;visibility:hidden;position:absolute;top:1px;left:1px;';
\r
702 // http://d.hatena.ne.jp/onozaty/20070830/p1
\r
703 // [JavaScript]IE6ではJavaScriptで動的に作成したiframeに対してsubmitできない(IE7は未確認) ->解決
\r
704 el.contentWindow.name = id;
\r
708 function asynkCallback(){
\r
713 })( window, document );
\r
716 var CSS = ( function( window, documwnt, undefined ){
\r
720 UNITS = 'px,cm,mm,in,pt,pc,em,%'.split( ',' ),
\r
721 CLIP_SEPARATOR = UA.isIE === true && UA.ieVersion < 8 ? ' ' : ',';
\r
723 var SPECIAL = ( function(){
\r
725 if( UA.isIE === true && UA.ieVersion < 9 ){
\r
726 if( UA.ACTIVEX === true ){
\r
727 // _special.opacity = 'ActiveXOpacity';
\r
728 _special.setFilters = function( style ){
\r
729 var filters = ( style.filter || '' ).split( ') ' ),
\r
731 i = filters.length,
\r
732 filter, names, props, prop, j, l, key, v;
\r
734 filter = filters[ --i ].split( ' ' ).join( '' ).split( '(' );
\r
735 if( filter.length !== 2 ) continue;
\r
736 names = filter[ 0 ].split( '.' ); // progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9)
\r
737 props = filter[ 1 ].split( ',' ); //
\r
739 for( j = 0, l = props.length; j < l; ++j ){
\r
740 prop = props[ j ].split( '=' );
\r
741 key = prop[ 0 ].toLowerCase();
\r
743 filter[ key ] = v; //v.charAt( 0 ) === '#' ? v : parseInt( v );
\r
745 data[ names[ names.length - 1 ] ] = filter;
\r
748 style.filter = data;
\r
749 style.opacity = data.alpha && data.alpha.opacity ? data.alpha.opacity / 100 : 1;
\r
751 _special.hasLayout = function( elm ){
\r
752 return elm.currentStyle.hasLayout;
\r
755 _special.opacity = null;
\r
758 var style = document.documentElement.style;
\r
759 _special.opacity = style.opacity !== undefined ? 'opacity' :
\r
760 style.MozOpacity !== undefined ? 'MozOpacity' :
\r
761 style.KhtmlOpacity !== undefined ? 'KhtmlOpacity' :
\r
762 style[ '-khtml-opacity' ] !== undefined ? 'KhtmlOpacity' : null;
\r
764 // if( style.backgroundPositionX === undefined ){
\r
765 _special.setBackgroundPositionXY = function( style ){
\r
766 var bgp = ( style.backgroundPosition || '' ).split( ' ' );
\r
767 style.backgroundPositionX = bgp[ 0 ] || 0;
\r
768 style.backgroundPositionY = bgp[ 1 ] || 0;
\r
771 if( style.clipTop === undefined && style[ 'clip-top' ] === undefined ){
\r
772 _special.setClipTopRightBottomLeft = function( style ){
\r
773 var clip = style.clip || '';
\r
774 if( clip.indexOf( 'rect(' ) === -1 ){
\r
776 style.clipRight = 0;
\r
777 style.clipBottom = 0;
\r
778 style.clipLeft = 0;
\r
781 clip = clip.split( '(' )[ 1 ].split( ')' )[ 0 ].split( clip.indexOf( ',' ) !== -1 ? ',' : ' ' );
\r
782 ret.clipTop = clip[ 0 ];
\r
783 ret.clipRight = clip[ 1 ];
\r
784 ret.clipBottom = clip[ 2 ];
\r
785 ret.clipLeft = clip[ 3 ];
\r
793 function cssToObject( css ){
\r
794 var ret = {}, i, nv, n, v,
\r
795 parse = Util.parse,
\r
796 isNumber = Type.isNumber,
\r
797 camelize = Util.camelize;
\r
798 if( Type.isString( css ) === true ){
\r
799 css = css.split( ';' );
\r
800 for( i = css.length; i; ){
\r
801 nv = css[ --i ].split( ':' ); // filter の場合, progid: がくる
\r
803 if( isNumber( parse( n ) ) === true ) continue;
\r
805 while( v.charAt( 0 ) === ' ' ) v = v.substr( 1 );
\r
806 ret[ camelize( n ) ] = parse( v );
\r
810 if( Type.isNumber( parse( n ) ) === false ) ret[ n ] = parse( css[ n ] );
\r
814 if( SPECIAL.setFilters ){
\r
815 SPECIAL.setFilters( ret );
\r
817 ret.opacity = SPECIAL.opacity !== null ? ret[ SPECIAL.opacity ] : 1;
\r
820 SPECIAL.setBackgroundPositionXY && SPECIAL.setBackgroundPositionXY( ret );
\r
821 SPECIAL.setClipTopRightBottomLeft && SPECIAL.setClipTopRightBottomLeft( ret );
\r
826 var COLOR = ( function(){
\r
827 var ret = {}, v, name,
\r
830 parseInt( 'FF0000', 16 ), 'RED',
\r
831 parseInt( '00FF00', 16 ), 'LIME',
\r
832 parseInt( '0000FF', 16 ), 'BLUE',
\r
833 parseInt( 'FFFF00', 16 ), 'YELLOW',
\r
834 parseInt( '00FFFF', 16 ), 'AQUA or CYAN',
\r
835 parseInt( 'FF00FF', 16 ), 'FUCHSIA or MAGENTA',
\r
836 parseInt( 'FFFFFF', 16 ), 'WHITE',
\r
837 parseInt( '008000', 16 ), 'GREEN',
\r
838 parseInt( '800080', 16 ), 'PURPLE',
\r
839 parseInt( '800000', 16 ), 'MAROON',
\r
840 parseInt( '000080', 16 ), 'NAVY',
\r
841 parseInt( '808000', 16 ), 'OLIVE',
\r
842 parseInt( '008080', 16 ), 'TEAL',
\r
843 parseInt( '808080', 16 ), 'GRAY',
\r
844 parseInt( 'C0C0C0', 16 ), 'SILVER',
\r
845 parseInt( '696969', 16 ), 'DIMGRAY',
\r
846 parseInt( '708090', 16 ), 'SLATEGRAY',
\r
847 parseInt( 'A9A9A9', 16 ), 'DARKGRAY',
\r
848 parseInt( 'DCDCDC', 16 ), 'GAINSBORO',
\r
849 parseInt( '191970', 16 ), 'MIDNIGHTBLUE',
\r
850 parseInt( '6A5ACD', 16 ), 'SLATEBLUE',
\r
851 parseInt( '0000CD', 16 ), 'MEDIUMBLUE',
\r
852 parseInt( '4169E1', 16 ), 'ROYALBLUE',
\r
853 parseInt( '1E90FF', 16 ), 'DODGERBLUE',
\r
854 parseInt( '87CEEB', 16 ), 'SKYBLUE',
\r
855 parseInt( '4682B4', 16 ), 'STEELBLUE',
\r
856 parseInt( 'ADD8E6', 16 ), 'LIGHTBLUE',
\r
857 parseInt( 'AFEEEE', 16 ), 'PALETURQUOISE',
\r
858 parseInt( '40E0D0', 16 ), 'TURQUOISE',
\r
859 parseInt( 'E0FFFF', 16 ), 'LIGHTCYAN',
\r
860 parseInt( '7FFFD4', 16 ), 'AQUAMARINE',
\r
861 parseInt( '006400', 16 ), 'DARKGREEN',
\r
862 parseInt( '2E8B57', 16 ), 'SEAGREEN',
\r
863 parseInt( '90EE90', 16 ), 'LIGHTGREEN',
\r
864 parseInt( '7FFF00', 16 ), 'CHARTREUSE',
\r
865 parseInt( 'ADFF2F', 16 ), 'GREENYELLOW',
\r
866 parseInt( '32CD32', 16 ), 'LIMEGREEN',
\r
867 parseInt( '9ACD32', 16 ), 'YELLOWGREEN',
\r
868 parseInt( '6B8E23', 16 ), 'OLIVEDRAB',
\r
869 parseInt( 'BCB76B', 16 ), 'DARKKHAKI',
\r
870 parseInt( 'EEE8AA', 16 ), 'PALEGOLDENROD',
\r
871 parseInt( 'FFFFE0', 16 ), 'LIGHTYELLOW',
\r
872 parseInt( 'FFD700', 16 ), 'GOLD',
\r
873 parseInt( 'DAA520', 16 ), 'GOLDENROD',
\r
874 parseInt( 'B8860B', 16 ), 'DARKGOLDENROD',
\r
875 parseInt( 'BC8F8F', 16 ), 'ROSYBROWN',
\r
876 parseInt( 'CD5C5C', 16 ), 'INDIANRED',
\r
877 parseInt( '8B4513', 16 ), 'SADDLEBROWN',
\r
878 parseInt( 'A0522D', 16 ), 'SIENNA',
\r
879 parseInt( 'CD853F', 16 ), 'PERU',
\r
880 parseInt( 'DEB887', 16 ), 'BURLYWOOD',
\r
881 parseInt( 'F5F5DC', 16 ), 'BEIGE',
\r
882 parseInt( 'F5DEB3', 16 ), 'WHEAT',
\r
883 parseInt( 'F4A460', 16 ), 'SANDYBROWN',
\r
884 parseInt( 'D2B48C', 16 ), 'TAN',
\r
885 parseInt( 'D2691E', 16 ), 'CHOCOLATE',
\r
886 parseInt( 'B22222', 16 ), 'FIREBRICK',
\r
887 parseInt( 'A52A2A', 16 ), 'BROWN',
\r
888 parseInt( 'FA8072', 16 ), 'SALMON',
\r
889 parseInt( 'FFA500', 16 ), 'ORANGE',
\r
890 parseInt( 'FF7F50', 16 ), 'CORAL',
\r
891 parseInt( 'FF6347', 16 ), 'TOMATO',
\r
892 parseInt( 'FF69B4', 16 ), 'HOTPINK',
\r
893 parseInt( 'FFC0CB', 16 ), 'PINK',
\r
894 parseInt( 'FF1493', 16 ), 'DEEPPINK',
\r
895 parseInt( 'DB7093', 16 ), 'PALEVIOLETRED',
\r
896 parseInt( 'EE82EE', 16 ), 'VIOLET',
\r
897 parseInt( 'DDA0DD', 16 ), 'PLUM',
\r
898 parseInt( 'DA70D6', 16 ), 'ORCHILD',
\r
899 parseInt( '9400D3', 16 ), 'DARKVIOLET',
\r
900 parseInt( '8A2BE2', 16 ), 'BLUEVIOLET',
\r
901 parseInt( '9370DB', 16 ), 'MEDIUMPURPLE',
\r
902 parseInt( 'D8BFD8', 16 ), 'THISTLE',
\r
903 parseInt( 'E6E6FA', 16 ), 'LAVENDER',
\r
904 parseInt( 'FFE4E1', 16 ), 'MISTYROSE',
\r
905 parseInt( 'FFFFF0', 16 ), 'IVORY',
\r
906 parseInt( 'FFFACD', 16 ), 'LEMONCHIFFON'
\r
908 for( i=list.length; i; ){
\r
910 name = list[ --i ];
\r
916 var PARAMS = ( function(){
\r
918 register( ret.percent = {},
\r
919 'marginBottom,marginLeft,marginRight,marginTop,paddingBottom,paddingLeft,paddingRight,paddingTop,fontSize,textIndent'
\r
921 register( ret.offset = {},
\r
922 'height,width,bottom,left,right,top'
\r
924 register( ret.size = {},
\r
925 'borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth,letterSpacing'
\r
927 register( ret.color = {},
\r
928 'backgroundColor,borderBottomColor,borderLeftColor,borderRightColor,borderTopColor,color'
\r
930 register( ret.region = {},
\r
931 'margin,padding,borderWidth,borderColor'
\r
933 register( ret.special = {},
\r
934 'clip,backgroundPosition,opacity,lineHeight,zIndex'
\r
936 register( ret.unit = {}, 'px,cm,mm,in,pt,pc,em,%' );
\r
938 register( ret.margin = {}, 'marginBottom,marginLeft,marginRight,marginTop,paddingBottom' );
\r
939 register( ret.padding = {}, 'paddingBottom,paddingLeft,paddingRight,paddingTop' );
\r
940 register( ret.borderWidth = {}, 'borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth' );
\r
941 register( ret.borderColor = {}, 'borderBottomColor,borderLeftColor,borderRightColor,borderTopColor' );
\r
943 function register( obj, params ){
\r
944 params = params.split( ',' );
\r
945 for( var i=params.length; i; ) obj[ params[ --i ] ] = true;
\r
953 var PropertyClass = function( name, value, unit, pxPerEm ){
\r
955 this.value = value;
\r
957 this.pxPerEm = pxPerEm; // XXpx = 1em;
\r
959 PropertyClass.prototype = {
\r
962 pxPerEm: 12, // 1em === ??px
\r
964 equal: function( prop ){
\r
965 if( this.unit === prop.unit ){
\r
966 return this.value === prop.value;
\r
968 return Math.abs( this.toPx() - prop.toPx() ) < 1;
\r
970 convert: function( prop ){
\r
971 var u = prop.unit, v;
\r
972 if( this.unit === u ) return;
\r
973 this.value = v = this.toPx();
\r
976 this.value = u === 'em' ? v / this.pxPerEm : Util.pxTo( v, u );
\r
979 setValue: function( v ){
\r
982 getValue: function(){
\r
985 getOffset: function( prop ){
\r
986 return prop.value - this.value;
\r
988 getUnit: function(){
\r
991 getValueText: function(){
\r
992 return this.value === 0 ? '0' : this.value + this.unit;
\r
997 if( t.hasOwnProperty && !t.hasOwnProperty( p ) ) continue;
\r
1002 var v = this.value, u = this.unit;
\r
1003 if( u === px ) return v;
\r
1004 if( u === 'em' ) return v * this.pxPerEm;
\r
1005 if( u === '' && this.name === 'lineHeight' ) return v * this.pxPerEm;
\r
1006 return Util.toPx( v, u );
\r
1008 isValid: function( t ){
\r
1013 z = u !== '' ? true : v === 0;
\r
1014 if( PARAMS.percent[ n ] === true ) return z;
\r
1015 if( PARAMS.offset[ n ] === true ) return z;
\r
1016 if( PARAMS.size[ n ] === true ) return z && u !== '%';
\r
1017 if( PARAMS.special[ n ] === true ){
\r
1018 if( n === 'lineHeight' ) return true;
\r
1019 if( n === 'opacity' ) return 0 <= v && v <= 1 && u === '';
\r
1020 if( n === 'zIndex' ) return u === '';
\r
1027 * backgroundPosition, clip
\r
1029 var PropertyGroupClass = function( name ){
\r
1032 for( var i = 1, l = arguments.length; i<l; ++i ){
\r
1033 this.props.push( arguments[ i ] );
\r
1038 * margin, padding, borderWidth, borderColor
\r
1040 var FrexiblePropertyClass = function( name ){
\r
1043 for( var i = 1, l = arguments.length; i<l; ++i ){
\r
1044 this.props.push( arguments[ i ] );
\r
1046 // top, bottom, left, right, topbottom, leftright, all
\r
1048 FrexiblePropertyClass.prototype = PropertyGroupClass.prototype = {
\r
1050 equal: function( prop ){
\r
1051 var ps = this.props, i = ps.length;
\r
1054 if( ps[ i ].equal( prop[ i ] ) === false ) return false;
\r
1058 convert: function( prop ){
\r
1059 var ps = this.props, i = ps.length;
\r
1062 ps[ i ].convert( prop[ i ] );
\r
1065 setValue: function( ary ){
\r
1066 var ps = this.props, i = 0, l = ps.length;
\r
1067 for( ; i<l; ++i ){
\r
1068 ps[ i ].setValue( ary[ i ] );
\r
1071 getValue: function(){
\r
1072 var ret = [], ps = this.props, i = 0, l = ps.length;
\r
1073 for( ; i<l; ++i ){
\r
1074 ret.push( ps[ i ].getValue() );
\r
1078 getOffset: function( prop ){
\r
1084 for( ; i<l; ++i ){
\r
1085 ret.push( ps[ i ].getOffset( _ps[ i ] ) );
\r
1089 getUnit: function(){
\r
1090 var ret = [], ps = this.props, i = 0, l = ps.length;
\r
1091 for( ; i<l; ++i ){
\r
1092 ret.push( ps[ i ].getUnit() );
\r
1096 getValueText: function(){
\r
1097 var ret = [], ps = this.props, i = 0, l = ps.length;
\r
1098 for( ; i<l; ++i ){
\r
1099 ret.push( ps[ i ].getValueText() );
\r
1101 if( this.name === 'clip' ){
\r
1102 return 'rect(' + ret.join( CLIP_SEPARATOR ) + ')';
\r
1104 return ret.join( ' ' );
\r
1106 clear: function(){
\r
1107 var ps = this.props, i = ps.length;
\r
1109 ps[ --i ].clear();
\r
1112 delete this.props;
\r
1114 isValid: function( t ){
\r
1116 var ps = t.props, i = ps.length;
\r
1119 if( ps[ i ].isValid() === false ) return false;
\r
1125 var ColorPropertyClass = function( name, r, g, b, pct ){
\r
1132 ColorPropertyClass.prototype = {
\r
1134 equal: function( prop ){
\r
1135 if( this.pct === prop.pct ){
\r
1136 return this.r === prop.r && this.g === prop.g && this.b === prop.b;
\r
1138 var rgb = this._toPct(),
\r
1139 _rgb = prop._toPct();
\r
1140 for( var i = rgb.length; i; ){
\r
1142 if( Math.abs( rgb[ i ] - _rgb[ i ] ) > 1 ) return false;
\r
1146 convert: function( prop ){
\r
1148 if( this.pct === u ) return;
\r
1149 var x = u === true ? 100 / 255 : 2.55;
\r
1155 setValue: function( rgb ){
\r
1156 this.r = rgb[ 0 ];
\r
1157 this.g = rgb[ 1 ];
\r
1158 this.b = rgb[ 2 ];
\r
1160 getValue: function(){
\r
1161 return [ this.r, this.g, this.b ];
\r
1163 getOffset: function( prop ){
\r
1164 return [ prop.r - this.r, prop.g - this.g, prop.b - this.b ];
\r
1166 getUnit: function(){
\r
1167 return this.pct === true ? '%' : '';
\r
1169 getValueText: function(){
\r
1170 if( this.pct === true ){
\r
1171 return [ 'rgb(', this.r, '%,', this.g, '%,', this.b, '%)' ].join( '' );
\r
1173 var round = Math.round;
\r
1174 //return [ 'rgb(', round( this.r ), ',', round( this.g ), ',', round( this.b ), ')' ].join( '' );
\r
1176 var rgb = '00000' + ( ( round( this.r ) << 16 ) + ( round( this.g ) << 8 ) + round( this.b ) ).toString( 16 );
\r
1177 return '#' + rgb.substr( rgb.length - 6 );
\r
1179 clear: function(){
\r
1182 if( t.hasOwnProperty && !t.hasOwnProperty( p ) ) continue;
\r
1186 _toPct: function(){
\r
1187 if( this.pct === true ) return [ this.r, this.g, this.b ];
\r
1188 return [ this.r / 2.55, this.g / 2.55, this.b / 2.55 ];
\r
1190 isValid: function( t ){
\r
1191 var isFinite = window.isFinite;
\r
1192 if( !isFinite( this.r ) || !isFinite( this.g ) || !isFinite( this.b ) ) return false;
\r
1193 if( 0 > this.r || 0 > this.g || 0 > this.b ) return false;
\r
1194 if( this.pct === true ){
\r
1195 return this.r <= 100 && this.g <= 100 && this.b <= 100;
\r
1197 return this.r <= 255 && this.g <= 255 && this.b <= 255;
\r
1201 var isString = Type.isString,
\r
1202 isNumber = Type.isNumber;
\r
1203 var REG_UINIT = /.*\d(\w{1,2})?/,
\r
1206 REG_XXXXXX = /^#[\da-fA-F]{6}?/,
\r
1207 REG_XXX = /^#[\da-fA-F]{3}?/;
\r
1209 var WrappedStyleClass = function( elm, style ){
\r
1211 this.style = style;
\r
1212 this.pxPerEm = this.get( 'fontSize' ).toPx();
\r
1215 WrappedStyleClass.prototype = {
\r
1216 get: function( p ){
\r
1217 if( PARAMS.special[ p ] === true || PARAMS.region[ p ] === true ){
\r
1218 if( p === 'clip' ) return this.getClip();
\r
1219 if( p === 'margin' ) return this.getMarginPaddingBorder( p );
\r
1220 if( p === 'padding' ) return this.getMarginPaddingBorder( p );
\r
1221 if( p === 'borderWidth' ) return this.getMarginPaddingBorder( 'border', 'Width' );
\r
1222 if( p === 'borderColor' ) return this.getBorderColor( 'borderColor' );
\r
1223 if( p === 'backgroundPosition' ) return this.getBackgroundPosition( p );
\r
1224 // opacity, zindex, lineHeight
\r
1225 return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x ), this.pxPerEm );
\r
1227 var x = this.style[ p ], e, v, u;
\r
1228 if( PARAMS.offset[ p ] === true ){
\r
1229 return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x, p ), this.pxPerEm );
\r
1232 if( p === 'width' ) v = e.offsetWidth;
\r
1233 if( p === 'height' ) v = e.offsetHeight;
\r
1234 if( p === 'top' ) v = e.offsetTop;
\r
1235 if( p === 'bottom' ) v = e.offsetBottom;
\r
1236 if( p === 'left' ) v = e.offsetLeft;
\r
1237 if( p === 'right' ) v = e.offsetRight;
\r
1238 u = this.getUnit( x, p );
\r
1239 // alert( p + this.pxTo( v, u ) + u )
\r
1240 return new PropertyClass( p, this.pxTo( v, u ), u, this.pxPerEm ); */
\r
1242 if( p === 'fontSize' ){ // xx-small 等
\r
1243 v = Util.absoluteFontSizeToPx( x );
\r
1245 return new PropertyClass( p, v, px, this.pxPerEm );
\r
1248 if( PARAMS.percent[ p ] === true ){
\r
1249 // alert( p + ' , ' + x + ' , ' + this.getUnit( x, p ) )
\r
1250 return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x, p ), this.pxPerEm );
\r
1252 if( PARAMS.size[ p ] === true ){
\r
1253 return new PropertyClass( p, this.getValue( x, p ), this.getUnit( x, p ), this.pxPerEm );
\r
1255 if( PARAMS.color[ p ] === true ){
\r
1256 return this.getColor( x, p );
\r
1259 pxTo: function( px, unit ){
\r
1260 if( unit === 'em' ) return px / this.pxPerEm;
\r
1261 return Util.pxTo( px, unit );
\r
1263 getValue: function( x, p ){
\r
1264 if( isString( x ) === true ){
\r
1265 return parseInt( x );
\r
1267 if( isNumber( x ) === true ){
\r
1272 getUnit: function( x, p ){
\r
1274 if( isString( x ) === true ){
\r
1275 u = x.replace( REG_UINIT, $1 );
\r
1276 if( p === 'lineHeight' ) return u;
\r
1277 if( PARAMS.unit[ u ] !== true ) return px;
\r
1282 getColor: function( x, p ){
\r
1283 var rgb = COLOR[ x.toUpperCase() ],
\r
1288 if( isNumber( rgb ) === true ){
\r
1289 r = ( rgb & 0xff0000 ) >> 16;
\r
1290 g = ( rgb & 0xff00 ) >> 8;
\r
1291 b = ( rgb & 0xff );
\r
1293 if( x.match( REG_XXXXXX ) ){
\r
1294 r = parseInt( x.charAt( 1 ) + x.charAt( 2 ), 16 );
\r
1295 g = parseInt( x.charAt( 3 ) + x.charAt( 4 ), 16 );
\r
1296 b = parseInt( x.charAt( 5 ) + x.charAt( 6 ), 16 );
\r
1297 //alert( x + ' g: ' + g )
\r
1299 if( x.match( REG_XXX ) ){
\r
1300 r = parseInt( x.charAt( 1 ) + x.charAt( 1 ), 16 );
\r
1301 g = parseInt( x.charAt( 2 ) + x.charAt( 2 ), 16 );
\r
1302 b = parseInt( x.charAt( 3 ) + x.charAt( 3 ), 16 );
\r
1304 if( x.indexOf( 'rgb(' ) === 0 ){
\r
1305 rgb = x.substr( 4 ).split( ',' );
\r
1306 r = parseFloat( rgb[ 0 ] );
\r
1307 g = parseFloat( rgb[ 1 ] );
\r
1308 b = parseFloat( rgb[ 2 ] );
\r
1309 if( x.indexOf( '%' ) !== -1 ){
\r
1317 return new ColorPropertyClass( p, r, g, b, pct );
\r
1319 getClip: function( name ){
\r
1320 // rect(...) クリップします。<top>, <bottom> は上端からの、 <right>, <left> は左端からのオフセットで指定します。Internet Explorer 4~7 では、カンマの代わりにスペースで区切る必要があります。
\r
1321 // position:absolute または position:fixed を適用した要素に対してのみ有効です。
\r
1322 var top = this.get( name + 'Top' ),
\r
1323 right = this.get( name + 'Right' ),
\r
1324 bottom = this.get( name + 'Bottom' ),
\r
1325 left = this.get( name + 'Left' ),
\r
1326 ret = new PropertyGroupClass( name, top, right, bottom, left );
\r
1327 if( ret.isValid() === true ) return ret;
\r
1329 all = this.style[ name ].split( '(' )[ 1 ].split( ')' )[ 0 ].split( CLIP_SEPARATOR );
\r
1330 return new PropertyGroupClass( name,
\r
1331 new PropertyClass( name + 'Top', all[ 0 ], px, this.pxPerEm ),
\r
1332 new PropertyClass( name + 'Right', all[ 1 ], px, this.pxPerEm ),
\r
1333 new PropertyClass( name + 'Bottom', all[ 2 ], px, this.pxPerEm ),
\r
1334 new PropertyClass( name + 'Left', all[ 3 ], px, this.pxPerEm )
\r
1337 getBackgroundPosition: function( name ){
\r
1338 var x = this.get( name + 'X' ),
\r
1339 y = this.get( name + 'Y' ),
\r
1340 ret = new PropertyGroupClass( name, x, y ),
\r
1342 if( ret.isValid() === true ) return ret;
\r
1344 xy = this.style[ name ].split( ' ' );
\r
1345 return new PropertyGroupClass( name,
\r
1346 new PropertyClass( name + 'X', this.getValue( xy[ 0 ] ), this.getUnit( xy[ 0 ] ), this.pxPerEm ),
\r
1347 new PropertyClass( name + 'Y', this.getValue( xy[ 1 ] ), this.getUnit( xy[ 1 ] ), this.pxPerEm )
\r
1350 getMarginPaddingBorder: function( name, widthOrColor ){
\r
1351 widthOrColor = widthOrColor || '';
\r
1352 var _class = PropertyClass,
\r
1353 top = this.get( name + 'Top' + widthOrColor ),
\r
1354 right = this.get( name + 'Right' + widthOrColor ),
\r
1355 bottom = this.get( name + 'Bottom' + widthOrColor ),
\r
1356 left = this.get( name + 'Left' + widthOrColor ),
\r
1357 ret = new FrexiblePropertyClass( name, top, right, bottom, left ),
\r
1360 if( ret.isValid() === true ) return ret;
\r
1362 all = this.style[ name + widthOrColor ].split( ' ' );
\r
1364 for( var i=0, l=all.length; i<l; ++i ){
\r
1366 v = this.getValue( x );
\r
1367 u = this.getUnit( x );
\r
1369 if( i === 0 ) top = new _class( name + 'Top' + widthOrColor, v, u, this.pxPerEm );
\r
1370 if( i === 1 ) right = new _class( name + 'Right' + widthOrColor, v, u, this.pxPerEm );
\r
1371 if( i === 2 ) bottom = new _class( name + 'Bottom' + widthOrColor, v, u, this.pxPerEm );
\r
1372 if( i === 3 ) left = new _class( name + 'Left' + widthOrColor, v, u, this.pxPerEm );
\r
1375 if( i === 0 ) top = new _class( name + 'Top' + widthOrColor, v, u, this.pxPerEm );
\r
1377 right = new _class( name + 'Right' + widthOrColor, v, u, this.pxPerEm );
\r
1378 left = new _class( name + 'Left' + widthOrColor, v, u, this.pxPerEm );
\r
1380 if( i === 2 ) bottom = new _class( name + 'Bottom' + widthOrColor , v, u, this.pxPerEm );
\r
1384 top = new _class( name + 'Top' + widthOrColor, v, u, this.pxPerEm );
\r
1385 bottom = new _class( name + 'Bottom' + widthOrColor, v, u, this.pxPerEm );
\r
1388 right = new _class( name + 'Right' + widthOrColor, v, u, this.pxPerEm );
\r
1389 left = new _class( name + 'Left' + widthOrColor, v, u, this.pxPerEm );
\r
1393 top = new _class( name + 'Top' + widthOrColor, v, u, this.pxPerEm );
\r
1394 bottom = new _class( name + 'Bottom' + widthOrColor, v, u, this.pxPerEm );
\r
1395 right = new _class( name + 'Right' + widthOrColor, v, u, this.pxPerEm );
\r
1396 left = new _class( name + 'Left' + widthOrColor, v, u, this.pxPerEm );
\r
1399 return new FrexiblePropertyClass( name, top, right, bottom, left );
\r
1401 getBorderColor: function( name ){
\r
1402 var getColor = this.getColor,
\r
1403 top = this.get( name + 'TopColor' ),
\r
1404 right = this.get( name + 'RightColor' ),
\r
1405 bottom = this.get( name + 'BottomColor' ),
\r
1406 left = this.get( name + 'LeftColor' ),
\r
1407 ret = new FrexiblePropertyClass( name, top, right, bottom, left ),
\r
1410 if( ret.isValid() === true ) return ret;
\r
1412 all = this.style[ name ].split( ' ' );
\r
1414 for( var i=0, l=all.length; i<l; ++i ){
\r
1417 if( i === 0 ) top = getColor( x, name + 'Top' );
\r
1418 if( i === 1 ) right = getColor( x, name + 'Right' );
\r
1419 if( i === 2 ) bottom = getColor( x, name + 'Bottom' );
\r
1420 if( i === 3 ) left = getColor( x, name + 'Left' );
\r
1423 if( i === 0 ) top = getColor( x, name + 'Top' );
\r
1425 right = getColor( x, name + 'Right' );
\r
1426 left = getColor( x, name + 'Left' );
\r
1428 if( i === 2 ) bottom = getColor( x, name + 'Bottom' );
\r
1432 top = getColor( x, name + 'Top' );
\r
1433 bottom = getColor( x, name + 'Bottom' );
\r
1436 right = getColor( x, name + 'Right' );
\r
1437 left = getColor( x, name + 'Left' );
\r
1441 top = getColor( x, name + 'Top' );
\r
1442 bottom = getColor( x, name + 'Bottom' );
\r
1443 right = getColor( x, name + 'Right' );
\r
1444 left = getColor( x, name + 'Left' );
\r
1447 return new FrexiblePropertyClass( name, top, right, bottom, left );
\r
1449 clear: function(){
\r
1452 if( t.hasOwnProperty && !t.hasOwnProperty( p ) ) continue;
\r
1457 function camelizeHash( obj ){
\r
1460 _p = Util.camelize( p );
\r
1461 if( _p === p ) continue;
\r
1462 obj[ _p ] = obj[ _p ] || obj[ p ];
\r
1468 getWrappedStyle: function( elm, opt_css ){
\r
1469 opt_css && camelizeHash( opt_css );
\r
1470 return new WrappedStyleClass( elm, opt_css || CSS.getComputedStyle( elm ) );
\r
1472 getInlineStyle: function( _elm ){
\r
1473 return cssToObject( _elm.style.cssText );
\r
1475 getStyleProperty : function( elm, property ){
\r
1476 if( document.defaultView && document.defaultView.getComputedStyle ){
\r
1477 CSS.getStyleProperty = function( elm, property ){
\r
1478 var obj = document.defaultView.getComputedStyle( elm, '' ),
\r
1481 fontSize = 'fontSize',
\r
1482 number = PARAMS.percent[ property ] || PARAMS.offset[ property ] || PARAMS.size[ property ] || PARAMS.color[ property ] || PARAMS.region[ property ] || PARAMS.special[ property ],
\r
1485 if( obj.cssText ){
\r
1486 css = obj.cssText.split( ';' );
\r
1487 for( i = css.length; i; ){
\r
1488 nv = css[ --i ].split( ':' ); // filter の場合, progid: がくる
\r
1489 n = Util.camelize( nv.shift() );
\r
1490 if( n === property && number === false ) return nv.join( '' );
\r
1491 if( n === property || n === fontSize ){
\r
1492 v = nv.join( '' );
\r
1493 while( v.charAt( 0 ) === ' ' ) v = v.substr( 1 );
\r
1495 if( style[ property ] && style[ fontSize ] ) break;
\r
1499 if( number === false ) return obj[ property ];
\r
1501 style[ property ] = obj[ property ];
\r
1502 if( !style[ property ] ) style[ property ] = obj[ Util.uncamelize( property ) ];
\r
1503 style[ fontSize ] = obj[ fontSize ];
\r
1504 if( !style[ fontSize ] ) style[ fontSize ] = obj[ Util.uncamelize( fontSize ) ];
\r
1507 wrapped = CSS.getWrappedStyle( elm, style );
\r
1509 return wrapped.get( property );
\r
1512 CSS.getStyleProperty = function( elm, property ){
\r
1513 var obj = elm.currentStyle,
\r
1516 fontSize = 'fontSize',
\r
1517 number = PARAMS.percent[ property ] || PARAMS.offset[ property ] || PARAMS.size[ property ] || PARAMS.color[ property ] || PARAMS.region[ property ] || PARAMS.special[ property ];
\r
1518 if( number === false ) return obj[ property ];
\r
1520 style[ property ] = obj[ property ];
\r
1521 if( !style[ property ] ) style[ property ] = obj[ Util.uncamelize( property ) ];
\r
1522 style[ fontSize ] = obj[ fontSize ];
\r
1523 if( !style[ fontSize ] ) style[ fontSize ] = obj[ Util.uncamelize( fontSize ) ];
\r
1525 wrapped = CSS.getWrappedStyle( elm, style );
\r
1527 return wrapped.get( property );
\r
1530 return CSS.getStyleProperty( elm, property );
\r
1532 getComputedStyle: function( elm ){
\r
1533 /* if( window.getComputedStyle ){
\r
1534 CSS.getComputedStyle = function( elm ){
\r
1535 return cssToObject( window.getComputedStyle( elm, '' ) );
\r
1538 if( document.defaultView && document.defaultView.getComputedStyle ){
\r
1539 CSS.getComputedStyle = function( elm ){
\r
1540 var obj = document.defaultView.getComputedStyle( elm, '' );
\r
1541 return cssToObject( obj.cssText || obj );
\r
1544 CSS.getComputedStyle = function( elm ){
\r
1545 return cssToObject( elm.currentStyle );
\r
1548 return CSS.getComputedStyle( elm );
\r
1550 toCssText: function( _css ){
\r
1552 for( var p in _css ){
\r
1553 if( PARAMS.margin[ p ] === true && _css.margin ) continue;
\r
1554 if( PARAMS.padding[ p ] === true && _css.padding ) continue;
\r
1555 if( PARAMS.borderWidth[ p ] === true && _css.borderWidth ) continue;
\r
1556 if( PARAMS.borderColor[ p ] === true && _css.borderColor ) continue;
\r
1558 v && ret.push( [ Util.uncamelize( p ), v ].join( ':' ) );
\r
1560 return ret.join( ';' );
\r
1564 })( window, document );
\r
1569 * susie-t, http://d.hatena.ne.jp/susie-t/20070218/1171760841
\r
1572 positionedOffset : function( element ){
\r
1575 include = Position.isIncludeBorder,
\r
1576 minus = Position.isMinusBodyBorder,
\r
1577 body = document.body,
\r
1578 parent, border, p;
\r
1580 valueT += element.offsetTop || 0;
\r
1581 valueL += element.offsetLeft || 0;
\r
1582 parent = element.offsetParent;
\r
1584 border = Position.getBorder( parent );
\r
1585 valueT += border[0];
\r
1586 valueL += border[1];
\r
1587 if( parent === body && minus ){
\r
1588 valueT += border[0];
\r
1589 valueL += border[1];
\r
1592 if( parent === body ) break;
\r
1594 p = CSS.getStyleProperty( parent, 'position' );
\r
1595 // p = CSS.getComputedStyle( parent ).position;
\r
1596 if( p === 'relative' || p === 'absolute' ) break;
\r
1598 } while( element = parent );
\r
1599 return [ valueL, valueT ];
\r
1601 page : function( forElement ){
\r
1604 include = Position.isIncludeBorder,
\r
1605 minus = Position.isMinusBodyBorder,
\r
1606 body = document.body,
\r
1607 element = forElement,
\r
1610 valueT += element.offsetTop || 0;
\r
1611 valueL += element.offsetLeft || 0;
\r
1612 parent = element.offsetParent;
\r
1614 border = Position.getBorder( parent );
\r
1615 valueT += border[1];
\r
1616 valueL += border[0];
\r
1617 if( parent === body && minus ){
\r
1618 valueT += border[0];
\r
1619 valueL += border[1];
\r
1623 if( parent === body && CSS.getStyleProperty( element, 'position' ) === 'absolute' ){
\r
1626 } while( element = parent );
\r
1628 element = forElement;
\r
1630 valueT -= element.scrollTop || 0;
\r
1631 valueL -= element.scrollLeft || 0;
\r
1632 } while( element = element.parentNode );
\r
1634 return [ valueL, valueT ];
\r
1636 getBorder : function( element ){
\r
1637 if( element === null ){
\r
1643 dhtmlStyle = CSS.getWrappedStyle( element );
\r
1644 compStyle = CSS.getComputedStyle( element );
\r
1645 if( compStyle.borderTopStyle !== 'none' ){
\r
1646 top = dhtmlStyle.get( 'borderTopWidth' ).toPx();//parseInt( Element.getStyle( element, 'border-top-width' ) );
\r
1648 if( compStyle.borderLeftStyle !== 'none' ){
\r
1649 left = dhtmlStyle.get( 'borderLeftWidth' ).toPx();//parseInt( Element.getStyle( element, 'border-left-width' ) );
\r
1654 if( CSS.getStyleProperty( element, 'borderTopStyle' ) !== 'none' ){
\r
1655 top = CSS.getStyleProperty( element, 'borderTopWidth' ).toPx();
\r
1657 if( CSS.getStyleProperty( element, 'borderLeftStyle' ) !== 'none' ){
\r
1658 left = CSS.getStyleProperty( element, 'borderLeftWidth' ).toPx();
\r
1661 return [ left || 0, top || 0 ];
\r
1663 isIncludeBorder : ( function() {
\r
1664 var parent = document.createElement( 'div' );
\r
1665 document.body.appendChild( parent );
\r
1666 parent.style.cssText = 'border:solid blue 10px; padding:0px; position:absolute; visibility:hidden;';
\r
1668 var child = document.createElement( 'div' );
\r
1669 parent.appendChild( child );
\r
1670 var ret = child.offsetTop === 0 ? false : true;
\r
1672 document.body.removeChild( parent );
\r
1676 isMinusBodyBorder : ( function(){
\r
1677 return document.body.offsetTop < CSS.getWrappedStyle( document.body ).get( 'marginTop' ).toPx();
\r
1678 // return document.body.offsetTop < CSS.getStyleProperty( document.body, 'marginTop' ).toPx();
\r
1680 cumulativeOffset : function( element ){
\r
1681 if( /Konqueror|Safari|KHTML/.test( navigator.userAgent ) ){
\r
1682 Position.cumulativeOffset = function( element ){
\r
1685 include = Position.isIncludeBorder,
\r
1686 minus = Position.isMinusBodyBorder,
\r
1687 body = document.body,
\r
1690 valueT += element.offsetTop || 0;
\r
1691 valueL += element.offsetLeft || 0;
\r
1692 parent = element.offsetParent;
\r
1694 border = Position.getBorder( parent );
\r
1695 valueT += border[1];
\r
1696 valueL += border[0];
\r
1697 if( parent === body && minus ){
\r
1698 valueT += border[0];
\r
1699 valueL += border[1];
\r
1702 if( parent === body && CSS.getStyleProperty( element, 'position' ) === 'absolute' ){
\r
1706 } while ( element );
\r
1708 return [ valueL, valueT ];
\r
1711 Position.cumulativeOffset = function( element ){
\r
1714 include = Position.isIncludeBorder,
\r
1715 minus = Position.isMinusBodyBorder,
\r
1716 body = document.body,
\r
1719 valueT += element.offsetTop || 0;
\r
1720 valueL += element.offsetLeft || 0;
\r
1721 parent = element.offsetParent;
\r
1723 border = Position.getBorder( parent );
\r
1724 valueT += border[1];
\r
1725 valueL += border[0];
\r
1726 if( parent === body && minus ){
\r
1727 valueT += border[0];
\r
1728 valueL += border[1];
\r
1732 } while( element );
\r
1733 return [ valueL, valueT ];
\r
1736 return Position.cumulativeOffset( element );
\r