fix XNode.text & X.Audio.Sprite & parse json of X.Net.XHR.

[pettanr/clientJs.git] / 0.6.x / js / 02_dom / 04_XBoxModel.js

diff --git a/0.6.x/js/02_dom/04_XBoxModel.js b/0.6.x/js/02_dom/04_XBoxModel.js
index 639ed3a..0a5c342 100644 (file)
--- a/0.6.x/js/02_dom/04_XBoxModel.js
+++ b/0.6.x/js/02_dom/04_XBoxModel.js
@@ -26,6 +26,20 @@ X_ViewPort.listenOnce( X_TEMP.SYSTEM_EVENT_INIT, function(){
                        'box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;' )\r
                                                                                        .width() === 10;\r
        };\r
+       \r
+       /*\r
+        * 古い Gekco、 Presto、 WebKit では影がレイアウトに影響します。たとえば、width が 100% のボックスに外向きの box-shadow を指定すると、横スクロールバーが表示されてしまいます。\r
+        * TODO boxShadow が有効な要素に対して offsetWidth 等の補正(?)\r
+        */\r
+       if( X_Node_CSS_Support[ 'boxShadow' ] &&\r
+               node.cssText(\r
+                       X_Node_CSS_uncamelize( X_Node_CSS_VENDER_PREFIX[ 'boxShadow' ] ) + ':10px 10px 0 0 #000;width:10px;'\r
+                               ).width() !== 10\r
+        ){\r
+               console.log( node.cssText() + node.width() );\r
+               X_Node_CSS_Support[ 'boxShadowLayoutBug' ] = true;\r
+       };\r
+\r
        // padding\r
        // border\r
        // margin\r
@@ -37,6 +51,7 @@ X_ViewPort.listenOnce( X_TEMP.SYSTEM_EVENT_INIT, function(){
                        .firstChild().cssText( 'position:absolute;top:8px;left:8px;margin:16px;border:32px solid #666;padding:64px;' )\r
                        .y();\r
 \r
+\r
        node.cssText( '' ).empty();\r
 });\r
 \r
@@ -53,7 +68,7 @@ Node.prototype.width = function(){
                console.log( 'xnode.width() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.width() : not belong tree.' );\r
                return 0;\r
@@ -75,7 +90,7 @@ Node.prototype.height = function(){
                console.log( 'xnode.height() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.height() : not belong tree.' );\r
                return 0;\r
@@ -97,7 +112,7 @@ Node.prototype.clientWidth = function(){
                console.log( 'xnode.width() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.width() : not belong tree.' );\r
                return 0;\r
@@ -119,7 +134,7 @@ Node.prototype.clientHeight = function(){
                console.log( 'xnode.height() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.height() : not belong tree.' );\r
                return 0;\r
@@ -141,7 +156,7 @@ Node.prototype.scrollWidth = function(){
                console.log( 'xnode.width() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.width() : not belong tree.' );\r
                return 0;\r
@@ -163,7 +178,7 @@ Node.prototype.scrollHeight = function(){
                console.log( 'xnode.height() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.height() : not belong tree.' );\r
                return 0;\r
@@ -185,7 +200,7 @@ Node.prototype.scrollLeft = function(){
                console.log( 'xnode.scrollLeft() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.scrollLeft() : not belong tree.' );\r
                return 0;\r
@@ -207,7 +222,7 @@ Node.prototype.scrollTop = function(){
                console.log( 'xnode.scrollTop() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.scrollTop() : not belong tree.' );\r
                return 0;\r
@@ -237,7 +252,7 @@ Node.prototype.x = function(){
                console.log( 'xnode.x() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.x() : not belong tree.' );\r
                return 0;\r
@@ -260,7 +275,7 @@ Node.prototype.y = function(){
                console.log( 'xnode.y() : no parent' );\r
                return 0;\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
        if( !this._root ){\r
                console.log( 'xnode.y() : not belong tree.' );\r
                return 0;\r
@@ -285,17 +300,19 @@ Node.prototype.offset = function( /* xnodeParent */ ){
                console.log( 'xnode.offset() : no parent' );\r
                return { x : 0, y : 0 };\r
        };\r
-       X_Node_body._updateTimerID && X_Node_startUpdate();\r
+       \r
        if( !this._root ){\r
                console.log( 'xnode.offset() : not belong tree.' );\r
                return { x : 0, y : 0 };\r
        };\r
-       if( this._state & X_Node_State.DISPLAY_NONE ) return 0;\r
+       if( this._state & X_Node_State.DISPLAY_NONE ) return { x : 0, y : 0 };\r
        \r
        if( X.Doc.body === this || X.Doc.html === this ){\r
                return { x : 0, y : 0 };\r
        };\r
        \r
+       X_Node_updateTimerID && X_Node_startUpdate();\r
+       \r
        if( X_UA_DOM.W3C ){\r
                elm = this._rawObject;\r
        } else\r
@@ -305,6 +322,8 @@ Node.prototype.offset = function( /* xnodeParent */ ){
                \r
        };\r
        \r
+       return X_Node_getPosition( elm );\r
+       \r
        while( elm && elm !== document.body ){\r
                x += elm.offsetLeft;\r
                y += elm.offsetTop;\r
@@ -312,3 +331,62 @@ Node.prototype.offset = function( /* xnodeParent */ ){
        };\r
        return { x : x, y : y };\r
 };\r
+\r
+// エレメントの座標取得 ～スクロール要素～\r
+// http://n-yagi.0r2.net/script/2009/06/post_14.html\r
+\r
+//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■\r
+//  エレメントの絶対座標を得たい\r
+//------------------------------------------------------------------------------\r
+//  座標取得\r
+var X_Node_getPosition =\r
+       document.documentElement && document.documentElement.getBoundingClientRect ?\r
+               function( el ){\r
+               var pos  = el.getBoundingClientRect(),\r
+                       html = document.documentElement,\r
+                       body = document.body;\r
+               return  {   x:(pos.left +   (body.scrollLeft||html.scrollLeft)  -   html.clientLeft)\r
+                       ,   y:(pos.top  +   (body.scrollTop||html.scrollTop)    -   html.clientTop) };\r
+               } :\r
+       X.UA.Opera < 10 ?\r
+               function( el ){\r
+                   var ex  =   0;\r
+                   var ey  =   0;\r
+                   do\r
+                   { \r
+                       ex  +=  el.offsetLeft;\r
+                       ey  +=  el.offsetTop;\r
+                   }\r
+                   while(  el  =   el.offsetParent );\r
+                   //\r
+                   return  {x:ex,y:ey};\r
+               } :\r
+               function(target)\r
+        {\r
+            var ex  =   0;\r
+            var ey  =   0;\r
+            //\r
+            var el  =   target;\r
+            var bd  =   document.body;\r
+            \r
+            do\r
+            { \r
+                ex  +=  el.offsetLeft   ||  0;\r
+                ey  +=  el.offsetTop    ||  0;\r
+            }\r
+            while(  el  =   el.offsetParent );\r
+            //  要素内スクロール対応\r
+            el  =   target;\r
+            do\r
+            {\r
+                ex  -=  el.scrollLeft   ||  0;\r
+                ey  -=  el.scrollTop    ||  0;\r
+                el  =   el.parentNode;\r
+            }\r
+            while(  el!=bd  );\r
+            //\r
+            return  {x:ex,y:ey};\r
+        };\r
+\r
+//■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■\r
+\r