0.6.x/js/dom/13_XDomBoxModel.js

   1 X.Dom.BoxModel = {
   2         CONTENT_BOX      : 1,
   3         PADDING_BOX      : 2,
   4         BORDER_BOX       : 3,
   5         MARGIN_BOX       : 4,
   6
   7         defaultBoxModel  : 0,
   8         boxSizingEnabled : false
   9 };
  10
  11 X.Dom.listenOnce( X.Dom.Event.DOM_INIT, function(){
  12 /*
  13         var elm = Node._systemNode._rawNode || Node._systemNode._ie4getRawNode();
  14         elm.style.cssText = 'width:10px;padding:1px;border:2px solid #0;margin:4px;';
  15
  16         X.Dom.BoxModel.defaultBoxModel = elm.offsetWidth === 10 ?
  17                 X.Dom.BoxModel.BORDER_BOX :
  18                 X.Dom.BoxModel.CONTENT_BOX;
  19
  20         if( X.Dom.BoxModel.defaultBoxModel === X.Dom.BoxModel.CONTENT_BOX ){
  21                 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;';
  22
  23                 X.Dom.BoxModel.boxSizingEnabled = elm.offsetWidth === 10;
  24         }; */
  25
  26
  27         // padding
  28         // border
  29         // margin
  30         // top
  31
  32
  33 });
  34
  35 /* --------------------------------------
  36  * Width, Height
  37  *  display:blobk かつ overflow:hidden かつ size（px,em）が設定されていたら、再描画しないでその値を返す
  38  *  display:none なら 0
  39  */
  40 Node.prototype.width = function(){
  41         if( !this.parent ){
  42                 console.log( 'xnode.width() : no parent' );
  43                 return 0;
  44         };
  45         Node.root._updateTimerID && Node.root._startUpdate();
  46         if( document.getElementById ){
  47                 // this.css( X.Dom.Style.Unit.px, 'width' );
  48                 return this._rawNode.offsetWidth;
  49         } else
  50         if( document.all ){
  51                 return ( this._rawNode || this._ie4getRawNode() ).offsetWidth;
  52         } else {
  53
  54         };
  55 };
  56
  57 Node.prototype.height = function(){
  58         if( !this.parent ){
  59                 console.log( 'xnode.height() : no parent' );
  60                 return 0;
  61         };
  62         Node.root._updateTimerID && Node.root._startUpdate();
  63         if( document.getElementById ){
  64                 // this.css( X.Dom.Style.Unit.px, 'height' );
  65                 return this._rawNode.offsetHeight;
  66         } else
  67         if( document.all ){
  68                 return ( this._rawNode || this._ie4getRawNode() ).offsetHeight;
  69         } else {
  70
  71         };
  72 };
  73
  74 /* --------------------------------------
  75  *  x, y
  76  *  position:absolute かつ x か y が設定されていたら、再描画しないで css オブジェクトから計算した値を返す。 float は?
  77  *  position:absolute の指定で自動で top,left を補う必要あり？ -> X.Dom.Style
  78  *  親要素 border 外側からの値。 IE, Firefox, Safari, Chrome の offsetLeft/Topでは、border 内側なので補正する。
  79  * transformX, Y は加える？ アニメーション中は？
  80  */
  81 // X.Dom.Style.transform,
  82 Node.prototype.x = function(){
  83         if( !this.parent ){
  84                 console.log( 'xnode.x() : no parent' );
  85                 return 0;
  86         };
  87         Node.root._updateTimerID && Node.root._startUpdate();
  88         if( document.getElementById ){
  89                 // this.css( X.Dom.Style.Unit.px, 'left' );
  90                 // this.css( X.Dom.Style.Unit.px, 'translateX' );
  91                 return this._rawNode.offsetLeft;
  92         } else
  93         if( document.all ){
  94                 return ( this._rawNode || this._ie4getRawNode() ).offsetLeft;
  95         } else {
  96
  97         };
  98 };
  99
 100 Node.prototype.y = function(){
 101         if( !this.parent ){
 102                 console.log( 'xnode.y() : no parent' );
 103                 return 0;
 104         };
 105         Node.root._updateTimerID && Node.root._startUpdate();
 106         if( document.getElementById ){
 107                 // this.css( X.Dom.Style.Unit.px, 'top' );
 108                 // this.css( X.Dom.Style.Unit.px, 'transisitonY' );
 109                 return this._rawNode.offsetTop;
 110         } else
 111         if( document.all ){
 112                 return ( this._rawNode || this._ie4getRawNode() ).offsetTop;
 113         } else {
 114
 115         };
 116 };
 117