X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;ds=sidebyside;f=0.6.x%2Fjs%2Fdom%2F13_XDomBoxModel.js;h=49a0288ef8f8bab8f19dabda5132d2fa9b422f8c;hb=c2184d5500fe31de24e248c9cdf92b31e547fd0c;hp=a67c5322f7dd50f9233238c0bca0761902405a63;hpb=fe7d89166f91ba4725406861031f57bcb6226d99;p=pettanr%2FclientJs.git

diff --git a/0.6.x/js/dom/13_XDomBoxModel.js b/0.6.x/js/dom/13_XDomBoxModel.js
index a67c532..49a0288 100644
--- a/0.6.x/js/dom/13_XDomBoxModel.js
+++ b/0.6.x/js/dom/13_XDomBoxModel.js
@@ -2,7 +2,6 @@ X.Dom.BoxModel = {
 	CONTENT_BOX      : 1,
 	PADDING_BOX      : 2,
 	BORDER_BOX       : 3,
-	MARGIN_BOX       : 4,
 		
 	defaultBoxModel  : 0,
 	boxSizingEnabled : false,
@@ -16,41 +15,45 @@ X.Dom.BoxModel = {
 
 X.Dom.listenOnce( X.Dom.Event.DOM_INIT, function(){
 
-	var elm = Node._systemNode._rawNode || Node._systemNode._ie4getRawNode();
-	elm.style.cssText = 'width:10px;padding:1px;border:2px solid #0;margin:4px;';
+	var node = Node._systemNode;
+	node.cssText( 'width:10px;padding:1px;border:2px solid #0;margin:4px;' );
 	
-	X.Dom.BoxModel.defaultBoxModel = elm.offsetWidth === 10 ?
+	X.Dom.BoxModel.defaultBoxModel = node.width() === 10 ?
 		X.Dom.BoxModel.BORDER_BOX :
 		X.Dom.BoxModel.CONTENT_BOX;
 	
 	if( X.Dom.BoxModel.defaultBoxModel === X.Dom.BoxModel.CONTENT_BOX ){
-		elm.style.cssText += 'box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing: border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;';
-		
-		X.Dom.BoxModel.boxSizingEnabled = elm.offsetWidth === 10;
+		X.Dom.BoxModel.boxSizingEnabled = node.cssText( 'width:10px;padding:1px;border:2px solid #0;margin:4px;' +
+			'box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing: border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;' )
+											.width() === 10;
 	};
 	// padding
 	// border
 	// margin
 	// top
 
-	elm.style.cssText = 'width:90px;height:90px;overflow:auto;';
-	elm.innerHTML = '<div style="width:100px;height:100px;"></div>';
+	node.cssText( 'width:90px;height:90px;overflow:auto;' )
+		.html( '<div style="width:100px;height:100px;"></div>' )
+		._startUpdate();
 	
-	X.Dom.BoxModel.vScrollbarSize = 90 - elm.clientWidth;
-	X.Dom.BoxModel.hScrollbarSize = 90 - elm.clientHeight;
-
-	elm.style.cssText = 'position:absolute;top:0;left:0;margin:1px;border:2px solid #000;padding:4px;';
-	elm.children[ 0 ].style.cssText = 'position:absolute;top:8px;left:8px;margin:16px;border:32px solid #666;padding:64px;';
+	X.Dom.BoxModel.vScrollbarSize = 90 - node._rawNode.clientWidth;
+	X.Dom.BoxModel.hScrollbarSize = 90 - node._rawNode.clientHeight;
 
-	X.Dom.BoxModel.absoluteOffset = elm.children[ 0 ].offsetTop;
+	X.Dom.BoxModel.absoluteOffset =
+		node.cssText( 'position:absolute;top:0;left:0;margin:1px;border:2px solid #000;padding:4px;' )
+			.firstChild().cssText( 'position:absolute;top:8px;left:8px;margin:16px;border:32px solid #666;padding:64px;' )
+			.y();
 
-	elm.style.cssText = elm.innerHTML = '';
+	node.cssText( '' ).empty();
 });
 
 /* --------------------------------------
  * Width, Height
  *  display:blobk かつ overflow:hidden かつ size（px,em）が設定されていたら、再描画しないでその値を返す
  *  display:none なら 0
+ * 
+ * getBoxObjectFor
+ * getBoundingClientRect
  */
 Node.prototype.width = function(){
 	if( !this.parent ){// todo : _state で tree に所属しているか？判定
@@ -63,11 +66,11 @@ Node.prototype.width = function(){
 		return 0;
 	};
 	if( this._state & X.Dom.State.DISPLAY_NONE ) return 0;
-	if( document.getElementById ){
+	if( X.Dom.DOM_W3C ){
 		// this.css( X.Dom.Style.Unit.px, 'width' );
 		return this._rawNode.offsetWidth;
 	} else
-	if( document.all ){
+	if( X.Dom.DOM_IE4 ){
 		return ( this._rawNode || this._ie4getRawNode() ).offsetWidth;
 	} else {
 		
@@ -85,11 +88,11 @@ Node.prototype.height = function(){
 		return 0;
 	};
 	if( this._state & X.Dom.State.DISPLAY_NONE ) return 0;
-	if( document.getElementById ){
+	if( X.Dom.DOM_W3C ){
 		// this.css( X.Dom.Style.Unit.px, 'height' );
 		return this._rawNode.offsetHeight;
 	} else
-	if( document.all ){
+	if( X.Dom.DOM_IE4 ){
 		return ( this._rawNode || this._ie4getRawNode() ).offsetHeight;
 	} else {
 		
@@ -107,11 +110,11 @@ Node.prototype.scrollWidth = function(){
 		return 0;
 	};
 	if( this._state & X.Dom.State.DISPLAY_NONE ) return 0;
-	if( document.getElementById ){
+	if( X.Dom.DOM_W3C ){
 		// this.css( X.Dom.Style.Unit.px, 'width' );
 		return this._rawNode.scrollWidth;
 	} else
-	if( document.all ){
+	if( X.Dom.DOM_IE4 ){
 		return ( this._rawNode || this._ie4getRawNode() ).scrollWidth;
 	} else {
 		
@@ -129,17 +132,60 @@ Node.prototype.scrollHeight = function(){
 		return 0;
 	};
 	if( this._state & X.Dom.State.DISPLAY_NONE ) return 0;
-	if( document.getElementById ){
+	if( X.Dom.DOM_W3C ){
 		// this.css( X.Dom.Style.Unit.px, 'height' );
 		return this._rawNode.scrollHeight;
 	} else
-	if( document.all ){
+	if( X.Dom.DOM_IE4 ){
 		return ( this._rawNode || this._ie4getRawNode() ).scollHeight;
 	} else {
 		
 	};
 };
 
+Node.prototype.scrollLeft = function(){
+	if( !this.parent ){// todo : _state で tree に所属しているか？判定
+		console.log( 'xnode.scrollLeft() : no parent' );
+		return 0;
+	};
+	Node.root._updateTimerID && Node.root._startUpdate();
+	if( !this._root ){
+		console.log( 'xnode.scrollLeft() : not belong tree.' );
+		return 0;
+	};
+	if( this._state & X.Dom.State.DISPLAY_NONE ) return 0;
+	if( X.Dom.DOM_W3C ){
+		// this.css( X.Dom.Style.Unit.px, 'width' );
+		return this._rawNode.scrollLeft;
+	} else
+	if( X.Dom.DOM_IE4 ){
+		return ( this._rawNode || this._ie4getRawNode() ).scrollLeft;
+	} else {
+		
+	};
+};
+
+Node.prototype.scrollTop = function(){
+	if( !this.parent ){// todo : _state で tree に所属しているか？判定
+		console.log( 'xnode.scrollTop() : no parent' );
+		return 0;
+	};
+	Node.root._updateTimerID && Node.root._startUpdate();
+	if( !this._root ){
+		console.log( 'xnode.scrollTop() : not belong tree.' );
+		return 0;
+	};
+	if( this._state & X.Dom.State.DISPLAY_NONE ) return 0;
+	if( X.Dom.DOM_W3C ){
+		// this.css( X.Dom.Style.Unit.px, 'width' );
+		return this._rawNode.scrollTop;
+	} else
+	if( X.Dom.DOM_IE4 ){
+		return ( this._rawNode || this._ie4getRawNode() ).scrollTop;
+	} else {
+		
+	};
+};
 
 /* --------------------------------------
  *  x, y
@@ -160,12 +206,12 @@ Node.prototype.x = function(){
 		return 0;
 	};
 	if( this._state & X.Dom.State.DISPLAY_NONE ) return 0;
-	if( document.getElementById ){
+	if( X.Dom.DOM_W3C ){
 		// this.css( X.Dom.Style.Unit.px, 'left' );
 		// this.css( X.Dom.Style.Unit.px, 'translateX' );
 		return this._rawNode.offsetLeft;
 	} else
-	if( document.all ){
+	if( X.Dom.DOM_IE4 ){
 		return ( this._rawNode || this._ie4getRawNode() ).offsetLeft;
 	} else {
 		
@@ -183,12 +229,12 @@ Node.prototype.y = function(){
 		return 0;
 	};
 	if( this._state & X.Dom.State.DISPLAY_NONE ) return 0;
-	if( document.getElementById ){
+	if( X.Dom.DOM_W3C ){
 		// this.css( X.Dom.Style.Unit.px, 'top' );
 		// this.css( X.Dom.Style.Unit.px, 'transisitonY' );
 		return this._rawNode.offsetTop;
 	} else
-	if( document.all ){
+	if( X.Dom.DOM_IE4 ){
 		return ( this._rawNode || this._ie4getRawNode() ).offsetTop;		
 	} else {