+++ /dev/null
-X.Css.Attr = {\r
- borderWidth : [ X.Css.Dirty.REFLOW, 0, X.Css.Type.QUARTET | X.Css.Type.LENGTH ], // em [ top, right, bottom, left ]\r
- borderColor : [ X.Css.Dirty.PAINT, 4, X.Css.Type.QUARTET | X.Css.Type.DEF_COLOR ], // color [ top, right, bottom, left ]\r
- borderStyle : [ X.Css.Dirty.PAINT, 8, X.Css.Type.QUARTET | X.Css.Type.LIST, X.Css.Option.BORDER_STYLE ], // string [ top, right, bottom, left ]\r
- cornerRadius : [ X.Css.Dirty.PAINT, 12, X.Css.Type.QUARTET | X.Css.Type.LENGTH | X.Css.Type.PERCENT ], // em, px [ top, right, bottom, left ]\r
- bgColor : [ X.Css.Dirty.PAINT, 16, X.Css.Type.COLOR ], // color\r
- bgAlpha : [ X.Css.Dirty.PAINT, 17, X.Css.Type.U_DECIMAL ], // 0 - 1\r
- bgImgUrl : [ X.Css.Dirty.PAINT, 18, X.Css.Type.URL ], // url\r
- bgImgRepeatX : [ X.Css.Dirty.PAINT, 19, X.Css.Type.BOOLEAN ], // true / false\r
- bgImgRepeatY : [ X.Css.Dirty.PAINT, 20, X.Css.Type.BOOLEAN ], // true / false\r
- bgImgPositionX : [ X.Css.Dirty.PAINT, 21, X.Css.Type.LENGTH | X.Css.Type.PERCENT | X.Css.Type.LIST, X.Css.Option.POSITION_X ], // em %, px, string\r
- bgImgPositionY : [ X.Css.Dirty.PAINT, 22, X.Css.Type.LENGTH | X.Css.Type.PERCENT | X.Css.Type.LIST, X.Css.Option.POSITION_Y ], // em %, px, string\r
- shadowColor : [ X.Css.Dirty.PAINT, 23, X.Css.Type.COLOR ], // color\r
- shadowAlpha : [ X.Css.Dirty.PAINT, 24, X.Css.Type.U_DECIMAL ], // 0 - 1\r
- shadowOffsetX : [ X.Css.Dirty.PAINT, 25, X.Css.Type.LENGTH ], // em\r
- shadowOffsetY : [ X.Css.Dirty.PAINT, 26, X.Css.Type.LENGTH ], // em\r
- shadowBlur : [ X.Css.Dirty.PAINT, 27, X.Css.Type.LENGTH ], // em\r
- shadowSpread : [ X.Css.Dirty.PAINT, 28, X.Css.Type.LENGTH ], // em\r
- shadowInset : [ X.Css.Dirty.PAINT, 29, X.Css.Type.BOOLEAN ], // true / false\r
- \r
- color : [ X.Css.Dirty.PAINT, 30, X.Css.Type.COLOR ], // color\r
- fontFamily : [ X.Css.Dirty.FONT, 31, X.Css.Dirty.FONT_NAME ], // string\r
- fontSize : [ X.Css.Dirty.FONT, 32, X.Css.Type.LENGTH | X.Css.Type.PERCENT ], // em, %\r
- bold : [ X.Css.Dirty.FONT, 33, X.Css.Type.BOOLEAN ], // true / false\r
- italic : [ X.Css.Dirty.FONT, 34, X.Css.Type.BOOLEAN ], // true / false\r
- lineHeight : [ X.Css.Dirty.FONT, 35, X.Css.Type.LENGTH | X.Css.Type.PERCENT | X.Css.Type.NUMERICAL ], // em, %, \r
- letterSpacing : [ X.Css.Dirty.FONT, 36, X.Css.Type.LENGTH ], // em\r
- wordSpacing : [ X.Css.Dirty.FONT, 37, X.Css.Type.LENGTH ],\r
- align : [ X.Css.Dirty.FONT, 38, X.Css.Type.LIST, X.Css.Type.ALIGN ],\r
- decoration : [ X.Css.Dirty.PAINT, 39, X.Css.Type.LIST, X.Css.Type.TEXT_DECORATION ],\r
- transform : [ X.Css.Dirty.FONT, 40, X.Css.Type.LIST, X.Css.Type.TEXT_TRANSFORM ],\r
- textShadowColor : [ X.Css.Dirty.PAINT, 41, X.Css.Type.COLOR ],\r
- textShadowOffsetX : [ X.Css.Dirty.PAINT, 42, X.Css.Type.LENGTH ],\r
- textShadowOffsetY : [ X.Css.Dirty.PAINT, 43, X.Css.Type.LENGTH ],\r
- shadowBlur : [ X.Css.Dirty.PAINT, 44, X.Css.Type.LENGTH ],\r
- \r
- width : [ X.Css.Dirty.REFLOW, 45, X.Css.Type.LENGTH | X.Css.Type.PERCENT, X.Css.Option.WIDTH_HEIGHT ],\r
- minWidth : [ X.Css.Dirty.REFLOW, 46, X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- maxWidth : [ X.Css.Dirty.REFLOW, 47, X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- height : [ X.Css.Dirty.REFLOW, 48, X.Css.Type.LENGTH | X.Css.Type.PERCENT, X.Css.Option.WIDTH_HEIGHT ],\r
- minHeight : [ X.Css.Dirty.REFLOW, 49, X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- maxHeight : [ X.Css.Dirty.REFLOW, 50, X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- padding : [ X.Css.Dirty.REFLOW, 51, X.Css.Type.QUARTET | X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- margin : [ X.Css.Dirty.REFLOW, 55, X.Css.Type.QUARTET | X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- sizing : [ X.Css.Dirty.REFLOW, 59, X.Css.Type.LIST, X.Css.Option.BOX_SIZING ],\r
- pageBox : [ X.Css.Dirty.REFLOW, 60, X.Css.Type.BOOLEAN ], // true / false\r
- left : [ X.Css.Dirty.REFLOW, 61, X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- top : [ X.Css.Dirty.REFLOW, 62, X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- bottom : [ X.Css.Dirty.REFLOW, 63, X.Css.Type.LENGTH | X.Css.Type.PERCENT ],\r
- right : [ X.Css.Dirty.REFLOW, 64, X.Css.Type.LENGTH | X.Css.Type.PERCENT ]\r
-};\r
-\r
-X.Css.Attr.x = X.Css.Attr.left;\r
-X.Css.Attr.y = X.Css.Attr.top;
\ No newline at end of file
+++ /dev/null
-X.Css.AttrNo = ( function(){\r
- var ret = {},\r
- obj = X.Css.Attr,\r
- p;\r
- for( p in obj ){\r
- ret[ p ] = obj[ p ][ 1 ];\r
- };\r
- return ret;\r
-})();\r
+++ /dev/null
- /**\r
- * 再計算と再描画\r
- * redraw 再描画はパラメータ変更後に setTimeout で\r
- * reflow 再計算は値が get された場合 invalidate が サイズだったら\r
- * または再描画前に invalidate がサイズなフラグが足っていたら \r
- */\r
- \r
-var BasicLayoutManager = X.Class.create(\r
- 'BasicLayoutManager',\r
- X.Class.POOL_OBJECT,\r
- {\r
- Constructor : function(){\r
- \r
- },\r
- redraw : function( nodeData ){\r
- var root = nodeData.__root;\r
- root.dirty === X.Css.Dirty.REFLOW && this.reflow( root );\r
- \r
- // draw\r
- },\r
- reflow : function( nodeData, allowW, allowH ){\r
- nodeData.preMesure( allowW, allowH );\r
- \r
- var children = nodeData.children, \r
- contentW = nodeData.contentWidth,\r
- contentH = nodeData.contentHeight,\r
- autoW = contentW === AUTO,\r
- autoH = contentH === AUTO,\r
- auto, calc, childW, childH, child, i, style, data,\r
- t, r, b, l; \r
- if( children ){\r
- auto = autoW && autoH;\r
- childW = 0;\r
- childH = 0;\r
- calc = BasicLayoutManager.calcValue; \r
- for( i = children.length; i; ){\r
- child = children[ --i ];\r
- style = child.__style;\r
- if( style ){\r
- data = style.data;\r
- t = calc( data[ X.Css.AttrNo.top ], contentH );\r
- r = calc( data[ X.Css.AttrNo.right ], contentW );\r
- b = calc( data[ X.Css.AttrNo.bottom ], contentH );\r
- l = calc( data[ X.Css.AttrNo.left ], contentW );\r
- } else {\r
- t = r = b = l = 0;\r
- };\r
- if( child instanceof LayoutBoxPrivate ){\r
- child.layoutManager.reflow( child, contentW - r - l, contentH - t - b );\r
- } else {\r
- child.preMesure( contentW - r - l, contentH - t - b );\r
- child.mesure();\r
- child.postMesure();\r
- };\r
- if( !auto ) continue;\r
- if( autoW && childW < child.boxWidth + r + l ) childW = child.boxWidth + r + l;\r
- if( autoH && childH < child.boxHeight + t + b ) childH = child.boxHeight + t + b; \r
- };\r
- if( autoW ) nodeData.contentWidth = childW;\r
- if( autoH ) nodeData.contentHeight = childH;\r
- };\r
- ( autoW || autoH ) && nodeData.postMesure();\r
- \r
- delete nodeData.dirty;\r
- }\r
- }\r
-);\r
-BasicLayoutManager.finalValue = function( styleValue, styleMin, styleMax, srcValue ){\r
- var calc = BasicLayoutManager.calcValue,\r
- v = calc( styleValue, srcValue ),\r
- min = calc( styleMin, srcValue ),\r
- max = calc( styleMax, srcValue );\r
- if( v < min ) return min;\r
- if( max < v ) return max;\r
- return v;\r
-};\r
-BasicLayoutManager.calcValue = function( styleValue, srcValue ){\r
- switch( styleValue ){\r
- case 0 :\r
- return 0;\r
- case AUTO :\r
- return AUTO;\r
- case FULL :\r
- return srcValue; // 100%\r
- default :\r
- if( 1 <= styleValue ) return styleValue; // legth\r
- if( -1 < styleValue ) return FLOOR( srcValue * styleValue ); // %\r
- };\r
- return styleValue; // - length\r
-};\r
-BasicLayoutManager.advancedCalcValue = function( styleValue, srcValue ){\r
- switch( styleValue ){\r
- case 0 :\r
- return 0;\r
- case AUTO :\r
- return srcValue;\r
- case FULL :\r
- throw new Error( 'advancedCalcValue FULL' ); \r
- // return ; // 100%\r
- default :\r
- if( 1 <= styleValue ) return styleValue; \r
- if( -1 < styleValue ) return FLOOR( ( srcValue / ( 1 - styleValue ) ) * styleValue ); // %\r
- };\r
- return styleValue; // - length\r
-};
\ No newline at end of file
+++ /dev/null
-X.Css.Dirty = {\r
- CLEAN : 0,\r
- PAINT : 1, // 再描画のみ必要\r
- REFLOW : 2, // レイアウトの再計算が必要\r
- FONT : 3, // フォントサイズが変更された\r
- CONTENT_UPDATE : 4 // コンテンツが変更された\r
-}
\ No newline at end of file
+++ /dev/null
-var _LayoutBox = _Node.inherits(\r
- '_LayoutBox',\r
- X.Class.POOL_OBJECT | X.Class.SUPER_ACCESS,\r
- {\r
- Constructor : function( layoutManager, _root, _parent ){\r
- this.layoutManager = layoutManager;\r
- this._root = _root;\r
- this.paintList = [];\r
- if( _parent ) this._parent = _parent;\r
- },\r
- mesure : function(){\r
- this.layoutManager.reflow( this );\r
- },\r
- paintReserve : function( nodeData ){\r
- var list = this.paintList;\r
- if( list.indexOf( nodeData ) === -1 ) list[ list.length ] = nodeData;\r
- },\r
- paintRelease : function( nodeData ){\r
- var list = this.paintList,\r
- i = list.indexOf( nodeData );\r
- i === -1 && list.splice( i, 1 );\r
- },\r
- paint : function(){\r
- var list = this.paintList, i = list.length;\r
- for( ; i; ){\r
- list[ --i ].paint();\r
- };\r
- }\r
- }\r
-);\r
-\r
-var LayoutBox = Node.inherits(\r
- 'LayoutBox',\r
- X.Class.POOL_OBJECT,\r
- _LayoutBox,\r
- {\r
- Constructor : function( layoutManager, root, parent ){\r
- LayoutBox.newPrivateData( this, layoutManager, X.Class._getPrivate( root ), parent ? X.Class._getPrivate( parent ) : undefined );\r
- },\r
- layoutManager : function( v ){\r
- \r
- },\r
- createLayoutBox : function(){\r
- \r
- },\r
- createContentBox : function(){\r
- \r
- }\r
- }\r
-);
\ No newline at end of file
+++ /dev/null
-var _Node = X.Class.create(\r
- '_Node',\r
- X.Class.PRIVATE_DATA | X.Class.POOL_OBJECT,\r
- {\r
- elmWrap : null,\r
- elmExtend : null,\r
- textNode : null,\r
- boxX : 0,\r
- boxY : 0,\r
- boxWidth : 0,\r
- boxHeight : 0,\r
- contentL : 0,\r
- contentT : 0,\r
- contentR : 0,\r
- contentB : 0,\r
- boxSizingOffsetLR : 0,\r
- boxSizingOffsetTB : 0, \r
- contentWidth : 0,\r
- minContentWidth : 0,\r
- maxContentWidth : AUTO,\r
- lastContentWidth : -1,\r
- contentHeight : 0,\r
- minContentHeight : 0,\r
- maxContentHeight : AUTO,\r
- Constructor : function( __root, __parent ){\r
- this.__root = __root;\r
- if( __parent ) this.__parent = __parent;\r
- },\r
- style : function( v ){\r
- if( v instanceof NodeStyle ){\r
- if( v !== this._style ){\r
- this.__style && this.__style.unRegister( this );\r
- this._style = v;\r
- this.__style = X.Class._getPrivate( v ); \r
- this.__style.register( this ); \r
- };\r
- return this.User;\r
- } else\r
- if( v === null ){\r
- this.__style && this.__style.unRegister( this );\r
- delete this._style;\r
- delete this.__style;\r
- return this.User;\r
- };\r
- return this._style;\r
- },\r
- content : function( v ){\r
- if( Type.isString( v ) === true ){\r
- if( !this.textNode || ( this.textNode && this.textNode.data !== v ) ){\r
- this._content = v;\r
- this.updateContent = true;\r
- };\r
- return this.User;\r
- } else\r
- if( v === null ){\r
- if( this._content !== v && this.textNode ){\r
- this._content = v;\r
- this.updateContent = true;\r
- };\r
- return this.User;\r
- };\r
- if( this._content ) return this._content;\r
- if( this._content === null ) return null;\r
- if( this.textNode ) return this.textNode.data;\r
- return null;\r
- },\r
- /**\r
- * 要素の追加・削除\r
- * 1. ペイントがある // 予約のみ\r
- * 2. コンテンツがある // 予約のみ *\r
- * 3. コンテンツを削除 // 予約のみ\r
- * 4. 要素を削除 // 予約のみ\r
- * \r
- * コンテンツの再計算\r
- * 0. 要素追加して css セット\r
- * 1. コンテンツの変更\r
- * 2. font 指定の変更\r
- * 3. contentWidth の変更 （コンテンツの高さの再計算） 前回の contentWidth の保持\r
- * \r
- * contentSize, scrollSize の決定\r
- */\r
- musure : function( dirty ){\r
- var content = this._content,\r
- root = this.__root,\r
- style = this.__style,\r
- w = this.contentWidth,\r
- h = this.contentHeight;\r
- switch( this.updateContent === true ? X.Css.Dirty.CONTENT : dirty ){\r
- case X.Css.Dirty.CONTENT : // コンテンツが変更された\r
- this.paint( 0 );\r
- this.lastContentWidth = -1;\r
- case X.Css.Dirty.FONT : // フォントサイズが変更された\r
- case X.Css.Dirty.REFLOW : // レイアウトの再計算が必要\r
- /* http://web-designs.seesaa.net/article/188400668.html\r
- * min-width の値が max-width の値より大きい場合は、max-width の値は min-width の値に設定される。\r
- * \r
- * テキストノードがあり\r
- * 1. contentWidth === AUTO\r
- * style を更新して contentWidth の決定\r
- * min or max に引っかかったら style 更新\r
- * contentHeight === AUTO の場合\r
- * textHeight の決定\r
- * contentHeight !== AUTO の場合 scrollHeight のみ更新\r
- * 2. contentHeight === AUTO かつ \r
- * コンテンツの高さの再取得が必要( contentWidth が最終計測時の contentWidth と一致 かつ フォント・コンテンツに変更無し の場合再取得不要)\r
- * style を更新して contentHeight の決定\r
- * 必要でない\r
- * 3. content のサイズがすでに決定している\r
- * コンテンツの高さの再取得が必要\r
- * 必要でない\r
- */ \r
- if( this.textNode ){\r
- if( w === AUTO ){\r
- this.commitStyle();\r
- w = this.contentWidth = this.textNode.offsetWidth;\r
- this.scrollWidth = w + this.contentL + this.contentR;\r
- if( this.maxContentWidth < w - this.boxSizingOffsetLR ) this.contentWidth = this.maxContentWidth + this.boxSizingOffsetLR;\r
- if( w - this.boxSizingOffsetLR < this.minContentWidth ) this.contentWidth = this.minContentWidth + this.boxSizingOffsetLR;\r
- this.lastContentWidth = this.contentWidth;\r
- \r
- w !== this.contentWidth && this.commitStyle();\r
- \r
- if( h === AUTO ){\r
- h = this.conetntHeight = this.textNode.offsetHeight;\r
- this.scrollHeight = h + this.contentT + this.contentB;\r
- if( this.maxContentHeight < h - this.boxSizingOffsetTB ) this.contentHeight = this.maxContentHeight + this.boxSizingOffsetTB;\r
- if( h - this.boxSizingOffsetTB < this.minContentHeight ) this.contentHeight = this.minContentHeight + this.boxSizingOffsetTB;\r
- } else {\r
- this.scrollHeight = this.textNode.offsetHeight + this.contentT + this.contentB;\r
- };\r
- } else\r
- if( h === AUTO ){\r
- if( w !== this.lastContentWidth || dirty !== X.Css.Dirty.REFLOW ){\r
- this.commitStyle();\r
- this.lastContentWidth = w;\r
- h = this.conetntHeight = this.textNode.offsetHeight;\r
- this.scrollWidth = w + this.contentL + this.contentR;\r
- this.scrollHeight = h + this.contentT + this.contentB;\r
- if( this.maxContentHeight < h - this.boxSizingOffsetTB ) this.contentHeight = this.maxContentHeight + this.boxSizingOffsetTB;\r
- if( h - this.boxSizingOffsetTB < this.minContentHeight ) this.contentHeight = this.minContentHeight + this.boxSizingOffsetTB; \r
- } else {\r
- this.scrollWidth = w + this.contentL + this.contentR;\r
- this.scrollHeight = h + this.contentT + this.contentB;\r
- root.paintReserve( this );\r
- };\r
- } else {\r
- if( dirty !== X.Css.Dirty.REFLOW ){\r
- this.commitStyle();\r
- this.scrollWidth = this.textNode.offsetWidth + this.contentL + this.contentR;\r
- this.scrollHeight = this.textNode.offsetHeight + this.contentT + this.contentB;\r
- } else {\r
- root.paintReserve( this );\r
- this.scrollWidth = w + this.contentL + this.contentR;\r
- this.scrollHeight = h + this.contentT + this.contentB;\r
- };\r
- }; \r
- } else {\r
- if( w === AUTO ) this.contentWidth = w = 0 < this.minContentWidth ? this.minContentWidth : 0;\r
- if( h === AUTO ) this.contentHeight = h = 0 < this.minContentHeight ? this.minContentHeight : 0;\r
- this.scrollWidth = w + this.contentL + this.contentR;\r
- this.scrollHeight = h + this.contentT + this.contentB;\r
- root.paintReserve( this ); \r
- };\r
- break; \r
- case X.Css.Dirty.PAINT : // 再描画のみ必要\r
- root.paintReserve( this );\r
- break; \r
- };\r
- },\r
- paint : function( dirty ){\r
- var content = this._content,\r
- style = this.__style; \r
- if( this.updateContent === true || ( style && style.hasPaint === true ) ){\r
- if( !this.elmWrap ){\r
- this.elmWrap = DOM.createDiv();\r
- this.__parent.addDisplayElement( this );\r
- };\r
- dirty !== 0 && this.commitStyle(); \r
- if( this.updateContent === true ){\r
- if( content !== null ){\r
- if( !this.textNode ){\r
- this.textNode = DOM.cerateText();\r
- this.elmWrap.appendChild( this.textNode );\r
- };\r
- this.textNode.data = content; \r
- } else\r
- if( this.textNode ){\r
- DOM.correct( this.textNode );\r
- delete this.textNode;\r
- delete this.contentWidth;\r
- delete this.conetntHeight;\r
- delete this.scrollWidth; \r
- delete this.scrollHeight;\r
- }; \r
- };\r
- } else\r
- if( this.elmWrap && content === null && ( !style || style.hasPaint === false ) ){\r
- this.__parent.removeDisplayElement( this );\r
- DOM.correct( this.elmWrap );\r
- delete this.contentWidth;\r
- delete this.conetntHeight;\r
- };\r
- },\r
- commitStyle : function(){\r
- var css;\r
- if( this.elmWrap ){\r
- css = this.__style ? this.__style.cssText( this ) : '';\r
- if( this.contentWidth !== AUTO ) css += 'width:' + this.contentWidth + 'px';\r
- if( this.contentHeight !== AUTO ) css += 'height:' + this.contentHeight + 'px';\r
- this.elmWrap.style.cssText = css;\r
- };\r
- },\r
- /*\r
- * 親の サイズを元に自身のサイズを計算していく\r
- */\r
- preMesure : function( allowW, allowH ){\r
- var style = this.__style,\r
- styles, calc, box, min, max,\r
- contentW, contentH, allowSize, boxMinus,\r
- paddingT, paddingR, paddingB, paddingL,\r
- borderT, borderR, borderB, borderL,\r
- marginT, marginR, marginB, marginL;\r
-\r
- if( style ){\r
- styles = style.data;\r
- calc = BasicLayoutManager.calcValue;\r
- box = styles[ X.Css.AttrNo.sizing ];\r
- \r
- // Width\r
- // 自身が constraintW の場合 親が AUTO ではない\r
- // 自身が constraintW でない場合自身が AUTO はなくかつ親 が AUTO の場合 or 自身は % でない\r
- if( style.constraintW ? allowW !== AUTO : !style.autoWidth && ( allowW !== AUTO || !style.percentWidth ) ){\r
- if( style.constraintW ){\r
- contentW = allowW;// - calc( styles[ X.Css.AttrNo.left ], allowW ) - calc( styles[ X.Css.AttrNo.right ], allowW );\r
- } else {\r
- contentW = BasicLayoutManager.finalValue( styles[ X.Css.AttrNo.width ], styles[ X.Css.AttrNo.minWidth ], styles[ X.Css.AttrNo.maxWidth ], allowW ); \r
- };\r
- paddingR = calc( styles[ X.Css.AttrNo.padding + 1 ], allowW );\r
- paddingL = calc( styles[ X.Css.AttrNo.padding + 3 ], allowW );\r
- borderR = styles[ X.Css.AttrNo.border + 1 ];\r
- borderL = styles[ X.Css.AttrNo.margin + 3 ];\r
- marginR = calc( styles[ X.Css.AttrNo.margin + 1 ], allowW );\r
- marginL = calc( styles[ X.Css.AttrNo.margin + 3 ], allowW );\r
- this.boxWidth = contentW;\r
- boxMinus = 0;\r
- switch( box ){\r
- case 3 : // margin-box\r
- boxMinus = - marginR - marginL;\r
- case 2 : // border-box\r
- boxMinus -= borderR + borderL;\r
- case 1 : // padding-box\r
- boxMinus -= paddingR + paddingL;\r
- // case 0 : // content-box\r
- };\r
- this.contentL = marginL + borderL + paddingL;\r
- this.contentR = marginR + borderR + paddingR; \r
- this.contentWidth = contentW + boxMinus;\r
- this.boxSizingOffsetLR = boxMinus;\r
- } else {\r
- this.boxWidth = this.contentWidth = AUTO;\r
- min = styles[ X.Css.AttrNo.minWidth ];\r
- max = styles[ X.Css.AttrNo.maxWidth ];\r
- this.minContentWidth = 1 <= min ? min : 0;\r
- this.maxContentWidth = 1 <= max ? max : AUTO;\r
- delete this.boxSizingOffsetLR;\r
- };\r
- \r
- // Height\r
- if( style.constraintH ? allowH !== AUTO : !style.autoHeight && ( allowH !== AUTO || !style.percentHeight ) ){\r
- if( style.constraintH ){\r
- contentH = allowH; // - calc( styles[ X.Css.AttrNo.top ], allowH ) - calc( styles[ X.Css.AttrNo.bottom ], allowH );\r
- } else {\r
- contentH = BasicLayoutManager.finalValue( styles[ X.Css.AttrNo.height ], styles[ X.Css.AttrNo.minHeight ], styles[ X.Css.AttrNo.maxHeight ], allowH );\r
- };\r
- allowSize = styles[ X.Css.AttrNo.pageBox ] === true ? allowH : allowW;\r
- paddingT = calc( styles[ X.Css.AttrNo.padding + 0 ], allowSize );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
- paddingB = calc( styles[ X.Css.AttrNo.padding + 2 ], allowSize );\r
- borderT = styles[ X.Css.AttrNo.border + 0 ];\r
- borderB = styles[ X.Css.AttrNo.border + 2 ];\r
- marginT = calc( styles[ X.Css.AttrNo.margin + 0 ], allowSize );// marginTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
- marginB = calc( styles[ X.Css.AttrNo.margin + 2 ], allowSize );\r
- this.boxHeight = contentH;\r
- boxMinus = 0;\r
- switch( box ){\r
- case 3 : // margin-box\r
- boxMinus = - marginT - marginR;\r
- case 2 : // border-box\r
- boxMinus -= borderT + borderR;\r
- case 1 : // padding-box\r
- boxMinus -= paddingT + paddingR;\r
- // case 0 : // content-box\r
- }; \r
- this.contentT = marginT + borderT + paddingT;\r
- this.conetntB = marginB + borderB + paddingB; \r
- this.contentHeight = contentH + boxMinus;\r
- this.boxSizingOffsetTB = boxMinus;\r
- } else {\r
- this.boxHeight = this.contentHeight = AUTO;\r
- min = styles[ X.Css.AttrNo.minHeight ];\r
- max = styles[ X.Css.AttrNo.maxHeight ];\r
- this.minContentHeight = 1 <= min ? min : 0;\r
- this.maxContentHeight = 1 <= max ? max : AUTO;\r
- delete this.boxSizingOffsetTB;\r
- };\r
- } else {\r
- this.boxWidth = this.contentWidth = allowW;\r
- this.boxHeight = this.contentHeight = allowH;\r
- delete this.minContentHeight;\r
- delete this.maxContentHeight;\r
- delete this.contentL;\r
- delete this.contentT;\r
- delete this.contentR;\r
- delete this.contentB;\r
- };\r
- },\r
- /**\r
- * 自身のコンテンツサイズを元に AUTO な width, height を確定していく\r
- */\r
- postMesure : function(){\r
- var style = this.__style,\r
- styles, calc, box,\r
- contentW, contentH, w, h\r
- contentSize, contentPlus;\r
- if( style ){\r
- styles = style.data;\r
- calc = BasicLayoutManager.advancedCalcValue;\r
- contentW = this.contentWidth;\r
- box = styles[ X.Css.AttrNo.sizing ];\r
- \r
- // Width\r
- if( this.boxWidth === AUTO ){\r
- paddingR = calc( styles[ X.Css.AttrNo.padding + 1 ], contentW ); \r
- paddingL = calc( styles[ X.Css.AttrNo.padding + 3 ], contentW ); \r
- borderR = styles[ X.Css.AttrNo.border + 1 ]; \r
- borderL = styles[ X.Css.AttrNo.border + 3 ]; \r
- marginR = calc( styles[ X.Css.AttrNo.margin + 1 ], contentW );\r
- marginL = calc( styles[ X.Css.AttrNo.margin + 3 ], contentW );\r
- contentPlus = 0;\r
- switch( box ){\r
- case 3 : // margin-box\r
- contentPlus = ( marginR + marginL );\r
- case 2 : // border-box\r
- contentPlus += ( borderR + borderL );\r
- case 1 : // padding-box\r
- contentPlus += ( paddingR + paddingL );\r
- // case 0 : // content-box\r
- };\r
- contentW += contentPlus;\r
- if( !style.constraintW ){\r
- min = styles[ X.Css.AttrNo.minWidth ];\r
- max = styles[ X.Css.AttrNo.maxWidth ];\r
- if( contentW < min && 1 <= min && contentPlus < min ){\r
- this.contentWidth = min - contentPlus;\r
- } else\r
- if( max < contentW && 1 <= max && contentPlus < max ){\r
- this.contentWidth = max - contentPlus;\r
- };\r
- };\r
- this.contentL = marginL + borderL + paddingL;\r
- this.contentR = marginR + borderR + paddingR;\r
- this.boxWidth = this.contentWidth + this.contentL + this.contentR;\r
- };\r
- // Height\r
- if( this.boxHeight === AUTO ){\r
- contentH = this.contentHeight;\r
- contentSize = styles[ X.Css.AttrNo.pageBox ] === true ? contentH : contentW;\r
- paddingT = calc( styles[ X.Css.AttrNo.padding + 0 ], contentSize );// paddingTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
- paddingB = calc( styles[ X.Css.AttrNo.padding + 2 ], contentSize );\r
- borderT = styles[ X.Css.AttrNo.border + 0 ];\r
- borderB = styles[ X.Css.AttrNo.border + 2 ];\r
- marginT = calc( styles[ X.Css.AttrNo.margin + 0 ], contentSize );// marginTRBL の % 指定は 最大幅に対して TB でも幅に対して\r
- marginB = calc( styles[ X.Css.AttrNo.margin + 2 ], contentSize );\r
- contentPlus = 0;\r
- switch( box ){\r
- case 3 : // margin-box\r
- contentPlus = ( marginT + marginB );\r
- case 2 : // border-box\r
- contentPlus += ( borderT + borderB );\r
- case 1 : // padding-box\r
- contentPlus += ( paddingT + paddingB );\r
- // case 0 : // content-box\r
- };\r
- contentH += contentPlus;\r
- if( !style.constraintH ){\r
- min = styles[ X.Css.AttrNo.minHeight ];\r
- max = styles[ X.Css.AttrNo.maxHeight ];\r
- if( contentH < min && 1 <= min && contentPlus < min ){\r
- this.contentHeight = min - contentPlus;\r
- } else\r
- if( max < contentH && 1 <= max && contentPlus < max ){\r
- this.contentHeight = max - contentPlus;\r
- };\r
- };\r
- this.contentT = marginT + borderT + paddingT;\r
- this.contentB = marginB + borderB + paddingB; \r
- this.boxHeight = this.contentHeight + this.contentT + this.contentB;\r
- }; \r
- } else {\r
- this.boxWidth = this.contentWidth;\r
- this.boxHeight = this.contentHeight;\r
- delete this.minContentHeight;\r
- delete this.maxContentHeight;\r
- delete this.contentL;\r
- delete this.contentT;\r
- delete this.contentR;\r
- delete this.contentB;\r
- };\r
- },\r
- addDisplayElement : function( nodeData ){\r
- // 描画更新リストに追加\r
- },\r
- removeDisplayElement : function( nodeData ){\r
- // 描画更新リストに追加\r
- DOM.correct( nodeData.elmWrap );\r
- delete nodeData.elmWrap;\r
- delete nodeData.textNode;\r
- delete nodeData.contentWidth;\r
- delete nodeData.conetntHeight;\r
- delete nodeData.currentWidth;\r
- delete nodeData.currentHeight; \r
- }\r
- }\r
-);\r
-var Node = X.Class.create(\r
- 'Node',\r
- X.Class.POOL_OBJECT,\r
- _Node,\r
- {\r
- Constructor : function( root, parent ){\r
- X.Class._newPrivate( this, X.Class._getPrivate( root ), parent ? X.Class._getPrivate( parent ) : undefined, this );\r
- },\r
- content : function( v ){\r
- return X.Class._getPrivate( this ).content( v );\r
- },\r
- style : function( v ){\r
- return X.Class._getPrivate( this ).paint( v );\r
- },\r
- remove : function(){\r
- X.Class._getPrivate( this ).remove();\r
- },\r
- nodeIndex : function( v ){\r
- return X.Class._getPrivate( this ).nodeIndex( v );\r
- },\r
- displayIndex : function(){\r
- \r
- },\r
- disabled : function( v ){\r
- return X.Class._getPrivate( this ).disabled( v );\r
- },\r
- cursor : function( v ){\r
- return X.Class._getPrivate( this ).cursor( v );\r
- },\r
- getX : function(){\r
- \r
- },\r
- getY : function(){\r
- \r
- },\r
- getWidth : function(){\r
- \r
- },\r
- getHeight : function(){\r
- \r
- },\r
- getAbsolutePositionX : function(){\r
- return X.Class._getPrivate( this ).getAbsolutePositionX();\r
- },\r
- getAbsolutePositionY : function(){\r
- return X.Class._getPrivate( this ).getAbsolutePositionY();\r
- },\r
- scrollTo : function( x, y ){\r
- X.Class._getPrivate( this ).scrollTo( x, y );\r
- },\r
- scrollX : function( v ){\r
- return X.Class._getPrivate( this ).scrollX( v );\r
- },\r
- scrollY : function( v ){\r
- return X.Class._getPrivate( this ).scrollY( v );\r
- },\r
- addEventListener : function( type, handler, opt_thisObject ){\r
- X.Class._getPrivate( this ).addEventListener( type, handler, opt_thisObject );\r
- },\r
- removeEventListener : function( type, handler ){\r
- X.Class._getPrivate( this ).removeEventListener( type, handler );\r
- }\r
- }\r
-);
\ No newline at end of file
+++ /dev/null
-var _NodeStyle = X.Class.create(\r
- '_NodeStyle',\r
- X.Class.PRIVATE_DATA | Class.POOL_OBJECT,\r
- {\r
- fontCssText : null,\r
- colorCssText : null,\r
- layoutCssText : null,\r
- Constructor : function(){\r
- this.data = [];\r
- this.dirty = 0;\r
- },\r
- register : function( node ){\r
- var root = node.__root,\r
- roots = this.rootList,\r
- nodes = this.nodeList;\r
- if( !roots ){\r
- this.rootList = [ root ];\r
- } else\r
- if( roots.indexOf( root ) === -1 ) roots[ roots.length ] = root;\r
- \r
- if( !nodes ){\r
- this.nodeList = [ node ];\r
- return;\r
- };\r
- if( nodes.indexOf( node ) === -1 ) nodes[ nodes.length ] = node;\r
- },\r
- unRegister : function( node ){\r
- var nodes = this.nodeList,\r
- i = nodes.indexOf( node ),\r
- root = node._root,\r
- roots = this.rootList,\r
- j = roots.indexOf( root );\r
- if( i !== -1 && nodes.splice( i, 1 ) && nodes.length === 0 ) delete this.nodeList;\r
- if( j !== -1 && roots.splice( j, 1 ) && roots.length === 0 ) delete this.rootList;\r
- },\r
- clone : function(){\r
- var styleClass = Class.getClass( this.User ),\r
- dataClass = Class.getClass( this );\r
- },\r
- /*\r
- * opt_unit は getter のみ\r
- */\r
- attr : function( prop, v, opt_unit ){\r
- var update = prop[ 0 ],\r
- propID = prop[ 1 ],\r
- type = prop[ 2 ],\r
- list = prop[ 3 ],\r
- length = !!( type & X.Css.Type.LENGTH ),\r
- percent = !!( type & X.Css.Type.PERCENT ),\r
- color = !!( type & X.Css.Type.COLOR ),\r
- uDecimal = !!( type & X.Css.Type.U_DECIMAL ),\r
- numerical = !!( type & X.Css.Type.NUMERICAL ),\r
- flag = !!( type & X.Css.Type.BOOLEAN ),\r
- quartet = !!( type & X.Css.Type.QUARTET ),\r
- url = !!( type & X.Css.Type.URL ),\r
- fontName = !!( type & X.Css.Type.FONT_NAME ),\r
- //list = !!( type & X.Css.Type.LIST ),\r
- combi = !!( type & X.Css.Type.COMBI ),\r
- data = this.data,\r
- _v = -1,\r
- i, l, nodes, root;\r
- /*\r
- * Setter\r
- */\r
- if( v !== undefined ){\r
- if( Type.isNumber( v ) === true ){\r
- if( numerical === false ){\r
- if( uDecimal === false || v < 0 || 1 < v ) throw new Error( '' );\r
- };\r
- } else\r
- if( Type.isBoolean( v ) === true ){\r
- if( flag === false ) throw new Error( '' );\r
- } else\r
- if( Type.isString( v ) === true ){\r
- if( url === false && fontName === false ){\r
- if( v.indexOf( ' ' ) !== -1 ){\r
- v = v.split( ' ' );\r
- } else {\r
- if( length === false && percent === false && color === false ) throw new Error( '' );\r
- };\r
- };\r
- }; \r
- if( Type.isArray( v ) === true ){\r
- if( v.length <= 4 && quartet === true ){\r
- type ^= X.Css.Type.QUARTET;\r
- } else\r
- if( v.length === 2 && combi === true ){\r
- type ^= X.Css.Type.COMBI;\r
- } else {\r
- throw new Error( '' );\r
- };\r
- switch( v.length ){\r
- case 1 :\r
- this.attr( [ propID , type, list ], v[ 0 ] );\r
- this.attr( [ ++propID, type, list ], v[ 0 ] );\r
- this.attr( [ ++propID, type, list ], v[ 0 ] );\r
- this.attr( [ ++propID, type, list ], v[ 0 ] );\r
- break;\r
- case 2 :\r
- this.attr( [ propID , type, list ], v[ 0 ] );\r
- this.attr( [ ++propID, type, list ], v[ 1 ] );\r
- this.attr( [ ++propID, type, list ], v[ 0 ] );\r
- this.attr( [ ++propID, type, list ], v[ 1 ] );\r
- break;\r
- case 3 :\r
- this.attr( [ propID , type, list ], v[ 0 ] );\r
- this.attr( [ ++propID, type, list ], v[ 1 ] );\r
- this.attr( [ ++propID, type, list ], v[ 2 ] );\r
- this.attr( [ ++propID, type, list ], v[ 1 ] );\r
- break;\r
- case 4 :\r
- this.attr( [ propID , type, list ], v[ 0 ] );\r
- this.attr( [ ++propID, type, list ], v[ 1 ] );\r
- this.attr( [ ++propID, type, list ], v[ 2 ] );\r
- this.attr( [ ++propID, type, list ], v[ 3 ] );\r
- break;\r
- default :\r
- };\r
- return this.User;\r
- };\r
- switch( update ){\r
- case X.Css.Dirty.REFLOW :\r
- delete this.layoutCssText;\r
- break;\r
- case X.Css.Dirty.PAINT :\r
- delete this.colorCssText;\r
- break;\r
- case X.Css.Dirty.FONT :\r
- delete this.fontCssText;\r
- };\r
-\r
- if( this.dirty < update ){\r
- this.dirty = update;\r
- roots = this.rootList;\r
- for( i = 0, l = roots.length; i < l; ++i ){\r
- root = roots[ i ];\r
- if( root.dirty < update ) root.dirty = update;\r
- };\r
- };\r
- \r
- if( list ) _v = list.indexOf( v );\r
- data[ propID ] = _v !== -1 ? _v : v;\r
- \r
- switch( propID ){\r
- case X.Css.AttrNo.left :\r
- case X.Css.AttrNo.right :\r
- this.constraintW = Type.isNumber( data[ X.Css.AttrNo.left ] ) || Type.isNumber( data[ X.Css.AttrNo.right ] );\r
- break;\r
- case X.Css.AttrNo.top :\r
- case X.Css.AttrNo.bottom :\r
- this.constraintH = Type.isNumber( data[ X.Css.AttrNo.top ] ) || Type.isNumber( data[ X.Css.AttrNo.bottom ] );\r
- break;\r
- case X.Css.AttrNo.width :\r
- this.autoWidth = v === AUTO;\r
- this.prctWidth = v === FULL || v < 1;\r
- break;\r
- case X.Css.AttrNo.height :\r
- this.autoHeight = v === AUTO;\r
- this.prctHeight = v === FULL || v < 1;\r
- break;\r
- }; \r
- return this.User;\r
- };\r
- /*\r
- * Getter\r
- */\r
- v = data[ propID ];\r
- // Unit\r
- if( quartet === true ) return [ v, data[ ++propID ], data[ ++propID ], data[ ++propID ] ];\r
- if( combi === true ) return [ v, data[ ++propID ] ];\r
- if( list && Type.isNumber( v ) === true ) return list[ v ];\r
- return v;\r
- },\r
- cssText : function(){\r
- if( this.fontCssText === null ) this.fontCssText = this.createFontCssText();\r
- if( this.layoutCssText === null ) this.layoutCssText = this.createLayoutCssText();\r
- if( this.colorCssText === null ) this.colorCssText = this.createColorCssText();\r
- return [ this.fontCssText, this.colorCssText, this.layoutCssText ].join( ';' );\r
- },\r
- createFontCssText : function(){\r
- var data = this.data,\r
- css = [],\r
- v;\r
- if( v = data[ X.Css.AttrNo.fontFamily ] ) css[ 0 ] = 'font-family:' + v;\r
- if( v = data[ X.Css.AttrNo.fontSize ] ) css[ css.length ] = 'font-size:' + v;\r
- if( v = data[ X.Css.AttrNo.bold ] ) css[ css.length ] = 'font-weight:bold';\r
- if( v = data[ X.Css.AttrNo.italic ] ) css[ css.length ] = 'font-style:italic';\r
- if( v = data[ X.Css.AttrNo.lineHeight ] ) css[ css.length ] = 'line-height:' + v;\r
- if( v = data[ X.Css.AttrNo.letterSpacing ] ) css[ css.length ] = 'letter-spacing:' + v;\r
- if( v = data[ X.Css.AttrNo.wordSpacing ] ) css[ css.length ] = 'word-spacing:' + v;\r
- if( v = data[ X.Css.AttrNo.align ] ) css[ css.length ] = 'text-align:' + X.Css.Option.ALIGN[ v ];\r
- if( v = data[ X.Css.AttrNo.transform ] ) css[ css.length ] = 'text-transform:' + X.Css.Option.TEXT_TRANSFORM[ v ];\r
- return css.join( ',' );\r
- },\r
- createColorCssText : function(){\r
- var data = this.data,\r
- css = [],\r
- v, x, y, c, b;\r
- if( v = data[ X.Css.AttrNo.borderColor ] ) css[ 0 ] = 'border-color:' + v;\r
- if( v = data[ X.Css.AttrNo.borderStyle + 0 ] ) css[ css.length ] = 'border-top-style:' + X.Css.Option.BORDER_STYLE[ v ];\r
- if( v = data[ X.Css.AttrNo.borderStyle + 1 ] ) css[ css.length ] = 'border-right-style:' + X.Css.Option.BORDER_STYLE[ v ];\r
- if( v = data[ X.Css.AttrNo.borderStyle + 2 ] ) css[ css.length ] = 'border-bottom-style:' + X.Css.Option.BORDER_STYLE[ v ];\r
- if( v = data[ X.Css.AttrNo.borderStyle + 3 ] ) css[ css.length ] = 'border-left-style:' + X.Css.Option.BORDER_STYLE[ v ];\r
- if( v = data[ X.Css.AttrNo.cornerRadius + 0 ] ) css[ css.length ] = 'corner-radius-top:' + v;\r
- if( v = data[ X.Css.AttrNo.cornerRadius + 1 ] ) css[ css.length ] = 'corner-radius-right:' + v;\r
- if( v = data[ X.Css.AttrNo.cornerRadius + 2 ] ) css[ css.length ] = 'border-radius-bottom:' + v;\r
- if( v = data[ X.Css.AttrNo.cornerRadius + 3 ] ) css[ css.length ] = 'border-radius-left:' + v;\r
- if( v = data[ X.Css.AttrNo.bgColor ] ) css[ css.length ] = 'background-color:' + v;\r
- // X.Css.AttrNo.bgAlpha\r
- if( v = data[ X.Css.AttrNo.bgImgUrl ] ) css[ css.length ] = 'background-image:url(' + v + ')';\r
- x = data[ X.Css.AttrNo.bgImgRepeatX ];\r
- y = data[ X.Css.AttrNo.bgImgRepeatY ];\r
- if( x && y ){\r
- css[ css.length ] = 'background-repeat:repeat';\r
- } else\r
- if( x ){\r
- css[ css.length ] = 'background-repeat:repeat-x';\r
- } else \r
- if( y ){\r
- css[ css.length ] = 'background-repeat:repeat-y';\r
- };\r
- x = data[ X.Css.AttrNo.bgImgPositionX ];\r
- y = data[ X.Css.AttrNo.bgImgPositionY ];\r
- if( x && y ){\r
- css[ css.length ] = 'background-position:' + x + ' ' + y;\r
- } else\r
- if( x ){\r
- css[ css.length ] = 'background-position:' + x + ' 0';\r
- } else \r
- if( y ){\r
- css[ css.length ] = 'background-position:0 ' + y;\r
- };\r
- if( v = data[ X.Css.AttrNo.color ] ) css[ css.length ] = 'color:' + v;\r
- if( v = data[ X.Css.AttrNo.decoration ] ) css[ css.length ] = 'text-decoration:' + X.Css.Option.TEXT_DECORATION[ v ];\r
- x = data[ X.Css.AttrNo.textShadowOffsetX ];\r
- y = data[ X.Css.AttrNo.textShadowOffsetY ];\r
- b = data[ X.Css.AttrNo.textShadowBlur ];\r
- c = data[ X.Css.AttrNo.textShadowColor ];\r
- if( c || x || y || b ){\r
- css[ css.length ] = 'text-shadow:' + x + ' ' + y + ' ' + b + ' ' + c;\r
- };\r
- /*\r
-X.Css.AttrNo.shadowColor = [ X.Css.Dirty.PAINT, 23, X.Css.Type.COLOR ]; // color\r
-X.Css.AttrNo.shadowAlpha = [ X.Css.Dirty.PAINT, 24, X.Css.Type.U_DECIMAL ]; // 0 - 1\r
-X.Css.AttrNo.shadowOffsetX = [ X.Css.Dirty.PAINT, 25, X.Css.Type.LENGTH ]; // em\r
-X.Css.AttrNo.shadowOffsetY = [ X.Css.Dirty.PAINT, 26, X.Css.Type.LENGTH ]; // em\r
-X.Css.AttrNo.shadowBlur = [ X.Css.Dirty.PAINT, 27, X.Css.Type.LENGTH ]; // em\r
-X.Css.AttrNo.shadowSpread = [ X.Css.Dirty.PAINT, 28, X.Css.Type.LENGTH ]; // em\r
-X.Css.AttrNo.shadowInset = [ X.Css.Dirty.PAINT, 29, X.Css.Type.BOOLEAN ]; // true / false\r
- */\r
- },\r
- createBoxShadowCssText : function(){\r
- \r
- },\r
- createBGAlphaCssText : function(){\r
- \r
- },\r
- createTextShadowCssText : function(){\r
- \r
- },\r
- createLayoutCssText : function(){\r
- \r
- }\r
- }\r
-);\r
-\r
-var NodeStyle = X.Class.create(\r
- 'NodeStyle',\r
- X.Class.POOL_OBJECT,\r
- _NodeStyle,\r
- {\r
- Constructor : function(){\r
- X.Class._newPrivate( this );\r
- },\r
- borderWidth : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.borderWidth, v );\r
- },\r
- borderColor : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.borderColor, v );\r
- },\r
- borderStyle : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.borderStyle, v );\r
- },\r
- cornerRadius : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.cornerRadius, v );\r
- },\r
- bgColor : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.bgColor, v );\r
- },\r
- bgAlpha : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.bgAlpha, v );\r
- },\r
- bgImgUrl : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.bgImgUrl, v );\r
- },\r
- bgImgRepeatX : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.bgImgRepeatX, v );\r
- },\r
- bgImgRepeatY : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.bgImgRepeatY, v );\r
- },\r
- bgImgPositionX : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.bgImgPositionX, v );\r
- },\r
- bgImgPositionY : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.bgImgPositionY, v );\r
- },\r
- shadowColor : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.shadowColor, v );\r
- },\r
- shadowAlpha : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.shadowAlpha, v );\r
- },\r
- shadowOffsetX : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.shadowOffsetX, v );\r
- },\r
- shadowOffsetY : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.shadowOffsetY, v );\r
- },\r
- shadowBlur : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.shadowBlur, v );\r
- },\r
- shadowSpread : function(){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.shadowSpread, v );\r
- },\r
- shadowInset : function(){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.shadowInset, v );\r
- },\r
- color : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.color, v );\r
- },\r
- fontFamily : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.fontFamily, v );\r
- },\r
- fontSize : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.fontSize, v );\r
- },\r
- bold : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.bold, v );\r
- },\r
- italic : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.italic, v );\r
- },\r
- lineHeight : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.lineHeight, v );\r
- },\r
- letterSpacing : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.letterSpacing, v );\r
- },\r
- wordSpacing : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.wordSpacing, v );\r
- },\r
- align : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.align, v );\r
- },\r
- decoration : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.decoration, v );\r
- },\r
- transform : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.transform, v );\r
- },\r
- textShadowColor : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.textShadowColor, v );\r
- },\r
- textShadowOffsetX : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.textShadowOffsetX, v );\r
- },\r
- textShadowOffsetY : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.textShadowOffsetY, v );\r
- },\r
- shadowBlur : function( v ){\r
- return X.Class._getPrivate( this ).attr( X.Css.Attr.shadowBlur, v );\r
- },\r
- cssText : function(){\r
- return X.Class._getPrivate( this ).cssText();\r
- }\r
- }\r
-);
\ No newline at end of file
+++ /dev/null
-X.Css.Option = {\r
- BORDER_STYLE : 'none,hidden,dotted,dashed,solid,double,groove,ridge,inset,outset'.split(','),\r
- POSITION_X : 'left,center,right'.split(','),\r
- POSITION_Y : 'top,center,bottom'.split(','),\r
- ALIGN : 'left,center,right,justify'.split(','),\r
- TEXT_DECORATION : 'none,underline,overline,line-through,blink'.split(','),\r
- TEXT_TRANSFORM : 'none,capitalize,lowercase,uppercase'.split(','),\r
- WIDTH_HEIGHT : [ 'auto' ],\r
- BOX_SIZING : 'content-box,padding-box,border-box,margin-box'.split(',')\r
-};
\ No newline at end of file
+++ /dev/null
-X.Css = {};\r
-\r
-X.Css.Type = {\r
- LENGTH : 1,\r
- PERCENT : 2,\r
- COLOR : 4,\r
- U_DECIMAL : 8,\r
- NUMERICAL : 16,\r
- BOOLEAN : 32,\r
- QUARTET : 64,\r
- URL : 128,\r
- FONT_NAME : 256,\r
- LIST : 512,\r
- AUTO : 1024,\r
- COMBI : 2048\r
-};\r
-\r
-var AUTO = Number.POSITIVE_INFINITY;\r
-var FULL = X.Css; // something unigue value;\r
-var FLOOR = Math.floor;\r
+++ /dev/null
-var BoxModel;\r
-\r
-var DOM = ( function( window, document ){\r
- var DIV_LIST = [],\r
- SPAN_LIST = [],\r
- TEXT_LIST = [];\r
- \r
- var elmTextSize;\r
- \r
- function correctNodes( node ){\r
- var child;\r
- if( node && node.parentNode ){\r
- while( node.lastChild ) correctNodes( node.lastChild );\r
- node.parentNode.removeChild( node );\r
- if( node.nodeType === 1 ){\r
- switch( node.tagName ){\r
- case 'DIV':\r
- DIV_LIST.push( node );\r
- break;\r
- case 'SPAN':\r
- SPAN_LIST.push( node );\r
- break;\r
- \r
- };\r
- node.removeAttribute( 'className' );\r
- node.removeAttribute( 'style' );\r
- node.removeAttribute( 'id' );\r
- } else\r
- if( node.nodeType === 3 ){\r
- node.data = '';\r
- TEXT_LIST.push( node );\r
- };\r
- };\r
- };\r
- \r
- return {\r
- createDiv : function(){\r
- return 0 < DIV_LIST.length ? DIV_LIST.shift() : document.createElement( 'div' );\r
- },\r
- createSpan : function(){\r
- \r
- },\r
- createText : function(){\r
- \r
- },\r
- getTextSize : function( elm, content ){\r
- var span = DOM.createSpan(),\r
- text = DOM.createText(),\r
- w, h;\r
- elm.appendChild( span );\r
- span.style.cssText = 'visibility:hidden;position:absolute;';\r
- span.appendChild( text );\r
- text.data = content;\r
- w = span.offsetWidth;\r
- h = span.offsetHeight;\r
- DOM.correctNodes( span );\r
- return [ w, h ];\r
- },\r
- getTextHeight : function( elm, w, content ){\r
- var div = DOM.createSpan(),\r
- text = DOM.createText(),\r
- w, h;\r
- elm.appendChild( div );\r
- div.style.cssText = 'visibility:hidden;position:absolute;width:' + w + 'px;';\r
- div.appendChild( text );\r
- text.data = content;\r
- w = div.offsetWidth;\r
- h = div.offsetHeight;\r
- DOM.correctNodes( div );\r
- return h;\r
- },\r
- correctNodes : function( node ){\r
- var child;\r
- if( node && node.parentNode ){\r
- while( node.lastChild ) DOM.correctNodes( node.lastChild );\r
- node.parentNode.removeChild( node );\r
- if( node.nodeType === 1 ){\r
- switch( node.tagName ){\r
- case 'DIV':\r
- DIV_LIST.push( node );\r
- break;\r
- case 'SPAN':\r
- SPAN_LIST.push( node );\r
- break;\r
- \r
- };\r
- node.removeAttribute( 'className' );\r
- node.removeAttribute( 'style' );\r
- node.removeAttribute( 'id' );\r
- } else\r
- if( node.nodeType === 3 ){\r
- node.data = '';\r
- TEXT_LIST.push( node );\r
- };\r
- };\r
- }\r
- }\r
-})( window, document );\r
-\r
-var XBrowserStyle = ( function(){\r
- var EMPTY = '',\r
- CORON = ':',\r
- SEMICORON = ';',\r
- SPACE = ' ',\r
- UNITS = 'px,cm,mm,in,pt,pc,em,%'.split( ',' ),\r
- CLIP_SEPARATOR = UA.isIE === true && UA.ieVersion < 8 ? ' ' : ',';\r
-\r
- var SPECIAL = ( function(){\r
- var special = {};\r
- if( UA.isIE === true && UA.ieVersion < 9 ){\r
- if( UA.ACTIVEX === true ){\r
- // special.opacity = 'ActiveXOpacity';\r
- special.setFilters = function( style ){\r
- var filters = ( style.filter || '' ).split( ') ' ),\r
- data = {},\r
- i = filters.length,\r
- filter, names, props, prop, j, l, key, v;\r
- for( ; i; ){\r
- filter = filters[ --i ].split( ' ' ).join( '' ).split( '(' );\r
- if( filter.length !== 2 ) continue;\r
- names = filter[ 0 ].split( '.' ); // progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9)\r
- props = filter[ 1 ].split( ',' ); // \r
- filter = {};\r
- for( j = 0, l = props.length; j < l; ++j ){\r
- prop = props[ j ].split( '=' );\r
- key = prop[ 0 ].toLowerCase();\r
- v = prop[ 1 ];\r
- filter[ key ] = v; //v.charAt( 0 ) === '#' ? v : parseInt( v );\r
- };\r
- data[ names[ names.length - 1 ] ] = filter;\r
- };\r
- \r
- style.filter = data;\r
- style.opacity = data.alpha && data.alpha.opacity ? data.alpha.opacity / 100 : 1;\r
- };\r
- special.hasLayout = function( elm ){\r
- return elm.currentStyle.hasLayout;\r
- };\r
- } else {\r
- special.opacity = null;\r
- };\r
- } else {\r
- var style = document.documentElement.style;\r
- special.opacity = style.opacity !== undefined ? 'opacity' : \r
- style.MozOpacity !== undefined ? 'MozOpacity' :\r
- style.KhtmlOpacity !== undefined ? 'KhtmlOpacity' :\r
- style[ '-khtml-opacity' ] !== undefined ? 'KhtmlOpacity' : null;\r
-\r
- // if( style.backgroundPositionX === undefined ){\r
- special.setBackgroundPositionXY = function( style ){\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
- if( !cliop || clip.indexOf( 'rect(' ) === -1 ){\r
- style.clipTop = 0;\r
- style.clipRight = 0;\r
- style.clipBottom = 0;\r
- style.clipLeft = 0;\r
- return;\r
- };\r
- clip = clip.split( '(' )[ 1 ].split( ')' )[ 0 ].split( clip.indexOf( ',' ) !== -1 ? ',' : ' ' );\r
- ret.clipTop = clip[ 0 ];\r
- ret.clipRight = clip[ 1 ];\r
- ret.clipBottom = clip[ 2 ];\r
- ret.clipLeft = clip[ 3 ];\r
- };\r
- };\r
- };\r
- return special;\r
- })();\r
- \r
- function cssToObject( css ){\r
- var ret = {}, i, nv, n, v,\r
- parse = Util.parse,\r
- isNumber = Type.isNumber,\r
- camelize = Util.camelize;\r
- if( Type.isString( css ) === true ){\r
- css = css.split( SEMICORON );\r
- for( i = css.length; i; ){\r
- nv = css[ --i ].split( CORON ); // filter の場合, progid: がくる\r
- n = nv.shift();\r
- if( isNumber( parse( n ) ) === true ) continue;\r
- v = nv.join( EMPTY );\r
- while( v.charAt( 0 ) === ' ' ) v = v.substr( 1 );\r
- ret[ camelize( n ) ] = parse( v );\r
- };\r
- } else {\r
- for( n in css ){\r
- if( Type.isNumber( parse( n ) ) === false ) ret[ n ] = parse( css[ n ] );\r
- };\r
- };\r
-\r
- if( SPECIAL.setFilters ){\r
- SPECIAL.setFilters( ret );\r
- } else {\r
- ret.opacity = SPECIAL.opacity !== null ? ret[ SPECIAL.opacity ] : 1;\r
- };\r
- \r
- SPECIAL.setBackgroundPositionXY && SPECIAL.setBackgroundPositionXY( ret );\r
- SPECIAL.setClipTopRightBottomLeft && SPECIAL.setClipTopRightBottomLeft( ret );\r
- \r
- return ret;\r
- };\r
-\r
- var COLOR = ( function(){\r
- var ret = {}, v, name,\r
- list = [\r
- '0', 'BLACK',\r
- 'FF0000', 'RED',\r
- '00FF00', 'LIME',\r
- '0000FF', 'BLUE',\r
- 'FFFF00', 'YELLOW',\r
- '00FFFF', 'AQUA',\r
- '00FFFF', 'CYAN',\r
- 'FF00FF', 'MAGENTA',\r
- 'FF00FF', 'FUCHSIA',\r
- 'FFFFFF', 'WHITE',\r
- '008000', 'GREEN',\r
- '800080', 'PURPLE',\r
- '800000', 'MAROON',\r
- '000080', 'NAVY',\r
- '808000', 'OLIVE',\r
- '008080', 'TEAL',\r
- '808080', 'GRAY',\r
- 'C0C0C0', 'SILVER',\r
- '696969', 'DIMGRAY',\r
- '708090', 'SLATEGRAY',\r
- 'A9A9A9', 'DARKGRAY',\r
- 'DCDCDC', 'GAINSBORO',\r
- '191970', 'MIDNIGHTBLUE',\r
- '6A5ACD', 'SLATEBLUE',\r
- '0000CD', 'MEDIUMBLUE',\r
- '4169E1', 'ROYALBLUE',\r
- '1E90FF', 'DODGERBLUE',\r
- '87CEEB', 'SKYBLUE',\r
- '4682B4', 'STEELBLUE',\r
- 'ADD8E6', 'LIGHTBLUE',\r
- 'AFEEEE', 'PALETURQUOISE',\r
- '40E0D0', 'TURQUOISE',\r
- 'E0FFFF', 'LIGHTCYAN',\r
- '7FFFD4', 'AQUAMARINE',\r
- '006400', 'DARKGREEN',\r
- '2E8B57', 'SEAGREEN',\r
- '90EE90', 'LIGHTGREEN',\r
- '7FFF00', 'CHARTREUSE',\r
- 'ADFF2F', 'GREENYELLOW',\r
- '32CD32', 'LIMEGREEN',\r
- '9ACD32', 'YELLOWGREEN',\r
- '6B8E23', 'OLIVEDRAB',\r
- 'BCB76B', 'DARKKHAKI',\r
- 'EEE8AA', 'PALEGOLDENROD',\r
- 'FFFFE0', 'LIGHTYELLOW',\r
- 'FFD700', 'GOLD',\r
- 'DAA520', 'GOLDENROD',\r
- 'B8860B', 'DARKGOLDENROD',\r
- 'BC8F8F', 'ROSYBROWN',\r
- 'CD5C5C', 'INDIANRED',\r
- '8B4513', 'SADDLEBROWN',\r
- 'A0522D', 'SIENNA',\r
- 'CD853F', 'PERU',\r
- 'DEB887', 'BURLYWOOD',\r
- 'F5F5DC', 'BEIGE',\r
- 'F5DEB3', 'WHEAT',\r
- 'F4A460', 'SANDYBROWN',\r
- 'D2B48C', 'TAN',\r
- 'D2691E', 'CHOCOLATE',\r
- 'B22222', 'FIREBRICK',\r
- 'A52A2A', 'BROWN',\r
- 'FA8072', 'SALMON',\r
- 'FFA500', 'ORANGE',\r
- 'FF7F50', 'CORAL',\r
- 'FF6347', 'TOMATO',\r
- 'FF69B4', 'HOTPINK',\r
- 'FFC0CB', 'PINK',\r
- 'FF1493', 'DEEPPINK',\r
- 'DB7093', 'PALEVIOLETRED',\r
- 'EE82EE', 'VIOLET',\r
- 'DDA0DD', 'PLUM',\r
- 'DA70D6', 'ORCHILD',\r
- '9400D3', 'DARKVIOLET',\r
- '8A2BE2', 'BLUEVIOLET',\r
- '9370DB', 'MEDIUMPURPLE',\r
- 'D8BFD8', 'THISTLE',\r
- 'E6E6FA', 'LAVENDER',\r
- 'FFE4E1', 'MISTYROSE',\r
- 'FFFFF0', 'IVORY',\r
- 'FFFACD', 'LEMONCHIFFON'\r
- ];\r
- for( i = list.length; i; ){\r
- v = list[ --i ];\r
- name = list[ --i ];\r
- ret[ name ] = parseInt( v, 16 );\r
- };\r
- return ret;\r
- })();\r
- \r
- var PARAMS = ( function(){\r
- var ret = {};\r
- register( ret.percent = {},\r
- 'marginBottom,marginLeft,marginRight,marginTop,paddingBottom,paddingLeft,paddingRight,paddingTop,fontSize,textIndent'\r
- );\r
- register( ret.offset = {},\r
- 'height,width,bottom,left,right,top'\r
- ); \r
- register( ret.size = {},\r
- 'borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth,letterSpacing'\r
- );\r
- register( ret.color = {},\r
- 'backgroundColor,borderBottomColor,borderLeftColor,borderRightColor,borderTopColor,color'\r
- );\r
- register( ret.region = {},\r
- 'margin,padding,borderWidth,borderColor'\r
- ); \r
- register( ret.special = {},\r
- 'clip,backgroundPosition,opacity,lineHeight,zIndex'\r
- );\r
- register( ret.unit = {}, 'px,cm,mm,in,pt,pc,em,%' );\r
- \r
- register( ret.margin = {}, 'marginBottom,marginLeft,marginRight,marginTop,paddingBottom' );\r
- register( ret.padding = {}, 'paddingBottom,paddingLeft,paddingRight,paddingTop' );\r
- register( ret.borderWidth = {}, 'borderBottomWidth,borderLeftWidth,borderRightWidth,borderTopWidth' );\r
- register( ret.borderColor = {}, 'borderBottomColor,borderLeftColor,borderRightColor,borderTopColor' );\r
- \r
- function register( obj, params ){\r
- params = params.split( ',' );\r
- for( var i=params.length; i; ) obj[ params[ --i ] ] = true;\r
- };\r
- return ret;\r
- })();\r
- \r
- /*\r
- * \r
- */\r
- var Property = Class.create(\r
- 'Property',\r
- Class.POOL_OBJECT,\r
- {\r
- Constructor : function( name, value, unit, pxPerEm ){\r
- this.name = name;\r
- this.value = value;\r
- this.unit = unit;\r
- this.pxPerEm = pxPerEm; // XXpx = 1em;\r
- },\r
- name : '',\r
- value : 0,\r
- pxPerEm : 12, // 1em === ??px\r
- unit : '',\r
- equal : function( prop ){\r
- if( this.unit === prop.unit ){\r
- return this.value === prop.value;\r
- };\r
- return Math.abs( this.toPx() - prop.toPx() ) < 1;\r
- },\r
- convert: function( prop ){\r
- var u = prop.unit, v;\r
- if( this.unit === u ) return;\r
- this.value = v = this.toPx();\r
- this.unit = 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
- },\r
- getValue: function(){\r
- return this.value;\r
- },\r
- getOffset: function( prop ){\r
- return prop.value - this.value;\r
- },\r
- getUnit: function(){\r
- return this.unit;\r
- },\r
- getValueText: function(){\r
- return this.value === 0 ? '0' : this.value + this.unit;\r
- },\r
- toPx: function(){\r
- var v = this.value, u = this.unit;\r
- if( u === px ) return v;\r
- if( u === 'em' ) return v * this.pxPerEm;\r
- if( u === '' && this.name === 'lineHeight' ) return v * this.pxPerEm;\r
- return Util.toPx( v, u );\r
- },\r
- isValid: function( t ){\r
- t = t || this;\r
- var n = t.name,\r
- v = t.value,\r
- u = t.unit,\r
- z = u !== '' ? true : v === 0;\r
- if( PARAMS.percent[ n ] === true ) return z;\r
- if( PARAMS.offset[ n ] === true ) return z;\r
- if( PARAMS.size[ n ] === true ) return z && u !== '%';\r
- if( PARAMS.special[ n ] === true ){\r
- if( n === 'lineHeight' ) return true;\r
- if( n === 'opacity' ) return 0 <= v && v <= 1 && u === '';\r
- if( n === 'zIndex' ) return u === '';\r
- };\r
- return false;\r
- }\r
- }\r
- );\r
- \r
- /**\r
- * backgroundPosition, clip\r
- */\r
- var PropertyGroup = Class.create(\r
- 'PropertyGroup',\r
- Class.POOL_OBJECT,\r
- {\r
- Constructor : function( name ){\r
- this.name = name;\r
- this.props = [];\r
- for( var i = 1, l = arguments.length; i<l; ++i ){\r
- this.props.push( arguments[ i ] );\r
- };\r
- },\r
- name : '',\r
- equal : function( prop ){\r
- var ps = this.props, i = ps.length;\r
- for( ; i; ){\r
- --i;\r
- if( ps[ i ].equal( prop[ i ] ) === false ) return false;\r
- };\r
- return true;\r
- },\r
- convert : function( prop ){\r
- var ps = this.props, i = ps.length;\r
- for( ; i; ){\r
- --i;\r
- ps[ i ].convert( prop[ i ] );\r
- };\r
- },\r
- setValue : function( ary ){\r
- var ps = this.props, i = 0, l = ps.length;\r
- for( ; i<l; ++i ){\r
- ps[ i ].setValue( ary[ i ] );\r
- };\r
- },\r
- getValue : function(){\r
- var ret = [], ps = this.props, i = 0, l = ps.length;\r
- for( ; i<l; ++i ){\r
- ret.push( ps[ i ].getValue() );\r
- };\r
- return ret;\r
- },\r
- getOffset : function( prop ){\r
- var ret = [],\r
- ps = this.props,\r
- _ps = prop.props,\r
- i = 0,\r
- l = ps.length;\r
- for( ; i<l; ++i ){\r
- ret.push( ps[ i ].getOffset( _ps[ i ] ) );\r
- };\r
- return ret;\r
- },\r
- getUnit : function(){\r
- var ret = [], ps = this.props, i = 0, l = ps.length;\r
- for( ; i<l; ++i ){\r
- ret.push( ps[ i ].getUnit() );\r
- };\r
- return ret;\r
- },\r
- getValueText : function(){\r
- var ret = [], ps = this.props, i = 0, l = ps.length;\r
- for( ; i<l; ++i ){\r
- ret.push( ps[ i ].getValueText() );\r
- }; \r
- if( this.name === 'clip' ){\r
- return 'rect(' + ret.join( CLIP_SEPARATOR ) + ')';\r
- };\r
- return ret.join( ' ' );\r
- },\r
- onKill : function(){\r
- var ps = this.props, i = ps.length;\r
- for( ; i; ){\r
- ps[ --i ].kill();\r
- };\r
- },\r
- isValid : function( t ){\r
- t = t || this;\r
- var ps = t.props, i = ps.length;\r
- for( ; i; ){\r
- if( ps[ --i ].isValid() === false ) return false;\r
- };\r
- return true;\r
- }\r
- }\r
- );\r
- \r
- /**\r
- * margin, padding, borderWidth, borderColor\r
- */\r
- var FrexibleProperty = PropertyGroup.inherits(\r
- 'FrexibleProperty',\r
- Class.POOL_OBJECT, {\r
- Constructor : function( name ){\r
- this.name = name;\r
- this.props = [];\r
- for( var i = 1, l = arguments.length; i<l; ++i ){\r
- this.props.push( arguments[ i ] );\r
- };\r
- // top, bottom, left, right, topbottom, leftright, all \r
- }\r
- }\r
- );\r
-\r
- var ColorProperty = Class.create(\r
- 'ColorProperty',\r
- Class.POOL_OBJECT, {\r
- Constructor : function( name, r, g, b, pct ){\r
- this.name = name;\r
- this.r = r;\r
- this.g = g;\r
- this.b = b;\r
- this.pct = pct;\r
- },\r
- name : '',\r
- equal : function( prop ){\r
- if( this.pct === prop.pct ){\r
- return this.r === prop.r && this.g === prop.g && this.b === prop.b;\r
- };\r
- var rgb = this._toPct(),\r
- _rgb = prop._toPct(),\r
- i = rgb.length;\r
- for( ; i; ){\r
- --i;\r
- if( Math.abs( rgb[ i ] - _rgb[ i ] ) > 1 ) return false;\r
- };\r
- return true;\r
- },\r
- convert : function( prop ){\r
- var u = prop.pct, x;\r
- if( this.pct === u ) return;\r
- x = u === true ? 100 / 255 : 2.55;\r
- this.r *= x;\r
- this.g *= x;\r
- this.b *= x;\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
- },\r
- getValue : function(){\r
- return [ this.r, this.g, this.b ];\r
- },\r
- getOffset : function( prop ){\r
- return [ prop.r - this.r, prop.g - this.g, prop.b - this.b ];\r
- },\r
- getUnit : function(){\r
- return this.pct === true ? '%' : '';\r
- },\r
- getValueText : function(){\r
- if( this.pct === true ){\r
- return [ 'rgb(', this.r, '%,', this.g, '%,', this.b, '%)' ].join( '' );\r
- };\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
- _toPct : function(){\r
- if( this.pct === true ) return [ this.r, this.g, this.b ];\r
- return [ this.r / 2.55, this.g / 2.55, this.b / 2.55 ];\r
- },\r
- isValid : function( t ){\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 ) return this.r <= 100 && this.g <= 100 && this.b <= 100;\r
- return this.r <= 255 && this.g <= 255 && this.b <= 255;\r
- }\r
- }\r
- );\r
- \r
- var isString = Type.isString,\r
- isNumber = Type.isNumber;\r
- var REG_UINIT = /.*\d(\w{1,2})?/,\r
- $1 = '$1',\r
- px = 'px',\r
- REG_XXXXXX = /^#[\da-fA-F]{6}?/,\r
- REG_XXX = /^#[\da-fA-F]{3}?/;\r
- \r
- var WrappedStyle = Class.create(\r
- 'WrappedStyle',\r
- Class.POOL_OBJECT,\r
- {\r
- Constructor : function( style ){\r
- this.style = style;\r
- var fontsize = this.get( 'fontSize' );\r
- this.pxPerEm = fontsize.toPx();\r
- fonstsize.kill();\r
- },\r
- get: function( p ){\r
- if( PARAMS.special[ p ] === true || PARAMS.region[ p ] === true ){\r
- if( p === 'clip' ) return this.getClip();\r
- if( p === 'margin' ) return this.getMarginPaddingBorder( p, '' );\r
- if( p === 'padding' ) return this.getMarginPaddingBorder( p, '' );\r
- if( p === 'borderWidth' ) return this.getMarginPaddingBorder( 'border', 'Width' );\r
- if( p === 'borderColor' ) return this.getBorderColor( 'borderColor' );\r
- if( p === 'backgroundPosition' ) return this.getBackgroundPosition( p );\r
- // opacity, zindex, lineHeight\r
- return new Property( p, this.getValue( x ), this.getUnit( x ), this.pxPerEm );\r
- };\r
- var x = this.style[ p ], e, v, u;\r
- if( PARAMS.offset[ p ] === true ){\r
- return new Property( p, this.getValue( x ), 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 === 'top' ) v = e.offsetTop;\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, p );\r
- // alert( p + this.pxTo( v, u ) + u )\r
- return new Property( p, this.pxTo( v, u ), u, this.pxPerEm ); */\r
- };\r
- if( p === 'fontSize' ){ // xx-small 等\r
- v = Util.absoluteFontSizeToPx( x );\r
- if( v !== 0 ){\r
- return new Property( p, v, px, this.pxPerEm );\r
- };\r
- }; \r
- if( PARAMS.percent[ p ] === true ){\r
- // alert( p + ' , ' + x + ' , ' + this.getUnit( x, p ) )\r
- return new Property( p, this.getValue( x ), this.getUnit( x, p ), this.pxPerEm );\r
- };\r
- if( PARAMS.size[ p ] === true ){\r
- return new Property( p, this.getValue( x ), this.getUnit( x, p ), this.pxPerEm );\r
- };\r
- if( PARAMS.color[ p ] === true ){\r
- return this.getColor( x, p );\r
- };\r
- },\r
- pxTo: function( px, unit ){\r
- if( unit === 'em' ) return px / this.pxPerEm;\r
- return Util.pxTo( px, unit );\r
- },\r
- getValue: function( x ){\r
- return isString( x ) === true ? parseInt( x ) :\r
- isNumber( x ) === true ? x : 0;\r
- },\r
- getUnit: function( x, p ){\r
- var u;\r
- if( isString( x ) === true ){\r
- u = x.replace( REG_UINIT, $1 );\r
- if( p === 'lineHeight' ) return u;\r
- if( PARAMS.unit[ u ] !== true ) return px;\r
- return u;\r
- };\r
- return px;\r
- },\r
- getColor: function( x, p ){\r
- var rgb = COLOR[ x.toUpperCase() ],\r
- pct = false,\r
- r = 0,\r
- g = 0,\r
- b = 0;\r
- if( isNumber( rgb ) === true ){\r
- r = ( rgb & 0xff0000 ) >> 16;\r
- g = ( rgb & 0xff00 ) >> 8;\r
- b = ( rgb & 0xff );\r
- } else\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
- r = parseFloat( rgb[ 0 ] );\r
- g = parseFloat( rgb[ 1 ] );\r
- b = parseFloat( rgb[ 2 ] );\r
- if( x.indexOf( '%' ) !== -1 ) pct = true;\r
- } else {\r
- r = 255;\r
- g = 255;\r
- b = 255;\r
- };\r
- return new ColorProperty( p, r, g, b, pct );\r
- },\r
- getClip: function( name ){\r
- // rect(...) クリップします。<top>, <bottom> は上端からの、 <right>, <left> は左端からのオフセットで指定します。Internet Explorer 4～7 では、カンマの代わりにスペースで区切る必要があります。\r
- // position:absolute または position:fixed を適用した要素に対してのみ有効です。\r
- var top = this.get( name + 'Top' ),\r
- right = this.get( name + 'Right' ),\r
- bottom = this.get( name + 'Bottom' ),\r
- left = this.get( name + 'Left' ),\r
- ret = new PropertyGroup( name, top, right, bottom, left),\r
- all;\r
- if( ret.isValid() === true ) return ret;\r
- ret.kill();\r
- all = this.style[ name ].split( '(' )[ 1 ].split( ')' )[ 0 ].split( CLIP_SEPARATOR );\r
- return new PropertyGroup( name,\r
- new Property( name + 'Top', all[ 0 ], px, this.pxPerEm ),\r
- new Property( name + 'Right', all[ 1 ], px, this.pxPerEm ),\r
- new Property( name + 'Bottom', all[ 2 ], px, this.pxPerEm ),\r
- new Property( name + 'Left', all[ 3 ], px, this.pxPerEm )\r
- );\r
- },\r
- getBackgroundPosition: function( name ){\r
- var x = this.get( name + 'X' ),\r
- y = this.get( name + 'Y' ),\r
- ret = new PropertyGroup( name, x, y ),\r
- xy;\r
- if( ret.isValid() === true ) return ret;\r
- ret.kill();\r
- xy = this.style[ name ].split( ' ' );\r
- return new PropertyGroup( name,\r
- new Property( name + 'X', this.getValue( xy[ 0 ] ), this.getUnit( xy[ 0 ] ), this.pxPerEm ),\r
- new Property( name + 'Y', this.getValue( xy[ 1 ] ), this.getUnit( xy[ 1 ] ), this.pxPerEm )\r
- );\r
- },\r
- getMarginPaddingBorder: function( name, width ){\r
- var props = [ name + 'Top' + width,\r
- name + 'Right' + width,\r
- name + 'Bottom' + width,\r
- name + 'Left' + width ],\r
- top = this.get( props[ 0 ] ),\r
- right = this.get( props[ 1 ] ),\r
- bottom = this.get( props[ 2 ] ),\r
- left = this.get( props[ 3 ] ),\r
- ret = new FrexibleProperty( name, top, right, bottom, left ),\r
- klass, pxPerEm, getValue, getUnit,\r
- all, _0, _1, _2, _3, v, u;\r
- if( ret.isValid() === true ) return ret;\r
- ret.kill();\r
- klass = Property;\r
- pxPerEm = this.pxPerEm;\r
- getValue = this.getValue;\r
- getUnit = this.getUnit;\r
- all = this.style[ name + width ].split( ' ' );\r
- _0 = all[ 0 ];\r
- _1 = all[ 1 ];\r
- _2 = all[ 2 ];\r
- _3 = all[ 3 ];\r
- v = getValue( _0 );\r
- u = getUnit( _0 );\r
- switch( all.length ){\r
- case 1 :\r
- top = new klass( props[ 0 ], v, u, pxPerEm );\r
- right = new klass( props[ 1 ], v, u, pxPerEm );\r
- bottom = new klass( props[ 2 ], v, u, pxPerEm );\r
- left = new klass( props[ 3 ], v, u, pxPerEm );\r
- break;\r
- case 2 :\r
- top = new klass( props[ 0 ], v, u, pxPerEm );\r
- bottom = new klass( props[ 2 ], v, u, pxPerEm );\r
- v = getValue( _1 );\r
- u = getUnit( _1 );\r
- right = new klass( props[ 1 ], v, u, pxPerEm );\r
- left = new klass( props[ 3 ], v, u, pxPerEm );\r
- break;\r
- case 3 :\r
- top = new klass( props[ 0 ], v, u, pxPerEm );\r
- v = getValue( _1 );\r
- u = getUnit( _1 );\r
- right = new klass( props[ 1 ], v, u, pxPerEm );\r
- left = new klass( props[ 3 ], v, u, pxPerEm );\r
- bottom = new klass( props[ 2 ], getValue( _2 ), getUnit( _2 ), pxPerEm );\r
- break;\r
- case 4 :\r
- top = new klass( props[ 0 ], v, u, pxPerEm );\r
- right = new klass( props[ 1 ], getValue( _1 ), getUnit( _1 ), pxPerEm );\r
- bottom = new klass( props[ 2 ], getValue( _2 ), getUnit( _2 ), pxPerEm );\r
- left = new klass( props[ 3 ], getValue( _3 ), getUnit( _3 ), pxPerEm );\r
- break;\r
- };\r
- return new FrexibleProperty( name, top, right, bottom, left );\r
- },\r
- getBorderColor: function( name ){\r
- var props = 'borderTopColor,borderRightColor,borderBottomColor,borderLeftColor'.split( ',' ),\r
- top = this.get( props[ 0 ] ),\r
- right = this.get( props[ 1 ] ),\r
- bottom = this.get( props[ 2 ] ),\r
- left = this.get( props[ 3 ] ),\r
- ret = new FrexibleProperty( name, top, right, bottom, left ),\r
- all, _0, _1, getColor;\r
- if( ret.isValid() === true ) return ret;\r
- ret.kill();\r
- getColor = this.getColor;\r
- all = this.style[ name ].split( ' ' );\r
- _0 = all[ 0 ];\r
- _1 = all[ 1 ];\r
- switch( all.length ){\r
- case 1 :\r
- top = getColor( _0, props[ 0 ] );\r
- right = getColor( _0, props[ 1 ] );\r
- bottom = getColor( _0, props[ 2 ] );\r
- left = getColor( _0, props[ 3 ] );\r
- break;\r
- case 2 :\r
- top = getColor( _0, props[ 0 ] );\r
- right = getColor( _1, props[ 1 ] );\r
- bottom = getColor( _0, props[ 2 ] );\r
- left = getColor( _1, props[ 3 ] );\r
- break;\r
- case 3 :\r
- top = getColor( _0, props[ 0 ] );\r
- right = getColor( _1, props[ 1 ] );\r
- bottom = getColor( all[ 2 ], props[ 2 ] );\r
- left = getColor( _1, props[ 3 ] );\r
- break;\r
- case 4 :\r
- top = getColor( _0, props[ 0 ] );\r
- right = getColor( _1, props[ 1 ] );\r
- bottom = getColor( all[ 2 ], props[ 2 ] );\r
- left = getColor( all[ 3 ], props[ 3 ] );\r
- break;\r
- };\r
- return new FrexibleProperty( name, top, right, bottom, left );\r
- }\r
- }\r
- );\r
- function camelizeHash( obj ){\r
- var p, _p, came = Util.camelize;\r
- for( p in obj ){\r
- _p = came( p );\r
- if( _p === p ) continue;\r
- obj[ _p ] = obj[ _p ] || obj[ p ];\r
- delete obj[ p ];\r
- };\r
- }; \r
- return {\r
- create: function( css ){\r
- return new WrappedStyle( camelizeHash( p ) );\r
- }\r
- };\r
-})();\r
-\r
-var XDocument = ( function( window, document ){\r
- \r
- var ROOT_LIST = [];\r
- var AUTO = Number.POSITIVE_INFINITY;\r
- var FULL = X.Css.Attr; // something unigue value;\r
- var FLOOR = Math.floor;\r
- \r
- var RootNode = Node.inherits(\r
- 'RootNode',\r
- Class.POOL_OBJECT,\r
- LayoutBoxPrivate,\r
- {\r
- Constructor : function(){\r
- RootNode.newPrivateData( this, BasicLayoutManager );\r
- }\r
- }\r
- );\r
- \r
-})( window, document );
\ No newline at end of file
OSDN Git Service
