scrollShadowColor : [ '#000', XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.COLOR ]\r
};\r
\r
-\r
var XUI_ScrollBox = XUI_ChromeBox.inherits(\r
'_ScrollBox',\r
- X_Class.PRIVATE_DATA,\r
+ X_Class.NONE,\r
{\r
directionLockThreshold : 10,\r
scrollXEnabled : true,\r
_containerNode : null,\r
xnodeSlider : null,\r
\r
- Constructor : function( layout, args ){\r
- this[ 'Super' ]( layout, args );\r
- this._containerNode = X_Class_getPrivate( this.containerNode );\r
+ Constructor : function( user, layout, args ){\r
+ this[ 'Super' ]( user, layout, args );\r
+ this._containerNode = X_Pair_get( this.containerNode );\r
this.xnodeSlider = this._containerNode.xnode[ 'className' ]( 'ScrollSlider' ).listen( X_EVENT_ANIME_END, this, X_UI_ScrollBox_onAnimeEnd );\r
this.xnode[ 'className' ]( 'ScrollBox' );\r
},\r
);\r
\r
function X_UI_ScrollBox_onLayoutBefore( e ){\r
+ if( e[ 'cancelable' ] && this.isInTransition && X_Node_Anime_translateZ ){\r
+ this[ 'listenOnce' ]( XUI_Event.SCROLL_END, X_UI_rootData, X_UI_rootData.calculate );\r
+ return X_Callback_PREVENT_DEFAULT;\r
+ };\r
this.scrollXRatio = this.scrollX ? this.scrollXMax / this.scrollX : 0;\r
this.scrollYRatio = this.scrollY ? this.scrollYMax / this.scrollY : 0;\r
this.xnodeSlider.stop();\r
+ this.isInTransition = false;\r
+ return X_Callback_NONE;\r
};\r
\r
function X_UI_ScrollBox_onLayoutComplete( e ){\r
\r
if( !this.hasHScroll ){\r
this.scrollXMax = 0;\r
- //this.scrollWidth = this.boxWidth;\r
};\r
\r
if( !this.hasVScroll ){\r
this.scrollYMax = 0;\r
- //this.scrollHeight = this.boxHeight;\r
};\r
\r
delete this.endTime;\r
delete this.directionX;\r
delete this.directionY;\r
\r
- //this.wrapperOffset = this.xnodeWrapper[ 'offset' ]();\r
-\r
- //this[ 'dispatch' ]('refresh');\r
-\r
X_UI_ScrollBox_resetPosition( this, 0 );\r
\r
if( this.hasHScroll || this.hasVScroll ){\r
// scroll が必要。\r
if( this.scrolling ){\r
- X_UI_ScrollBox_translate( this, this.scrollXMax * this.scrollXRatio, this.scrollYMax * this.scrollYRatio, 0, '', 0 );\r
+ X_UI_ScrollBox_translate( this, this.scrollXMax * this.scrollXRatio, this.scrollYMax * this.scrollYRatio, 100, '', 300 );\r
} else {\r
// scroller 作る\r
this[ 'listen' ]( XUI_Event._POINTER_DOWN, this, X_UI_ScrollBox_onStart );\r
X_UI_rootData[ 'listen' ]( XUI_Event.LAYOUT_BEFORE, this, X_UI_ScrollBox_onLayoutBefore );\r
\r
- X_UI_ScrollBox_translate( this, this.scrollXMax * this.scrollXRatio, this.scrollYMax * this.scrollYRatio, 0, '', 0 );\r
+ X_UI_ScrollBox_translate( this, this.scrollXMax * this.scrollXRatio, this.scrollYMax * this.scrollYRatio, 100, '', 300 );\r
this.scrolling = true;\r
};\r
} else\r
this[ 'unlisten' ]( XUI_Event._POINTER_DOWN, this, X_UI_ScrollBox_onStart );\r
X_UI_rootData[ 'unlisten' ]( XUI_Event.LAYOUT_BEFORE, this, X_UI_ScrollBox_onLayoutBefore );\r
\r
- ( this.scrollX !== 0 || this.scrollY !== 0 ) && X_UI_ScrollBox_translate( this, 0, 0, 0, '', 0 );\r
+ ( this.scrollX !== 0 || this.scrollY !== 0 ) && X_UI_ScrollBox_translate( this, 0, 0, 100, '', 300 );\r
\r
delete this.scrolling;\r
delete this.scrollXRatio;\r
};\r
};\r
\r
+ // TODO use scrollLeft, scrollTop\r
function X_UI_ScrollBox_translate( that, x, y, opt_time, opt_easing, opt_release ){\r
\r
opt_time = 0 <= opt_time ? opt_time : 0;\r
if( this.isInTransition || this.isAnimating ){\r
this.isInTransition = this.isAnimating = false;\r
this[ 'dispatch' ]( XUI_Event.SCROLL_END );\r
+ this.xnodeSlider.stop();\r
}; \r
\r
this.startX = this.scrollX;\r
this.pointX = e.pageX;\r
this.pointY = e.pageY;\r
\r
+ console.log( 'scrollstart ' + e.pageY );\r
+ \r
this[ 'listen' ]( XUI_Event._POINTER_MOVE, this, X_UI_ScrollBox_onMove );\r
this[ 'listen' ]( [ XUI_Event._POINTER_UP, XUI_Event._POINTER_CANCEL ], this, X_UI_ScrollBox_onEnd );\r
\r
newX, newY,\r
absDistX, absDistY;\r
// 規定以上の move でスクロール開始\r
- \r
+\r
+console.log( 'scrollmove ' + e.buttons + ' ' + e.button );\r
+\r
if( !this.scrollEnabled || e.pointerType !== this.initiated ){\r
return ret;\r
};\r
// we scrolled less than 10 pixels\r
if( !this.moved ){\r
// this[ 'dispatch' ]( X_EVENT_CANCELED );\r
- console.log( 'we scrolled less than 10 pixels' );\r
+ console.log( 'we scrolled less than 10 pixels ' + e.pageY );\r
return ret;\r
};\r
\r
};\r
if( !X_UI_ScrollBox_resetPosition( this, this.bounceTime ) ){\r
this.isInTransition = false;\r
- this.dispatch( XUI_Event.SCROLL_END );\r
+ this[ 'dispatch' ]( XUI_Event.SCROLL_END );\r
};\r
return X_Callback_NONE;\r
};\r
\r
+// TODO Box の継承に！\r
X.UI.ScrollBox = X.UI.ChromeBox.inherits(\r
'ScrollBox',\r
X_Class.NONE,\r
- XUI_ScrollBox,\r
{\r
Constructor : function(){\r
var args = [\r
- XUI_Layout_Vertical, \r
+ XUI_Layout_Canvas, \r
{\r
- name : 'ScrollBox-Scroller',\r
- role : 'container',\r
- width : 'auto',\r
- minWidth : '100%',\r
- height : 'auto',\r
- minHeight : '100%'\r
+ name : 'ScrollBox-Scroller',\r
+ role : 'container',\r
+ width : 'auto',\r
+ minWidth : '100%',\r
+ height : 'auto',\r
+ minHeight : '100%'\r
}\r
],\r
i = arguments.length,\r
};\r
};\r
\r
- X_Class_newPrivate(\r
+ X_Pair_create(\r
this,\r
- XUI_Layout_Canvas,\r
- [\r
- {\r
- width : '100%',\r
- height : '100%'\r
- },\r
- X.UI.VBox.apply( 0, args )\r
- ]\r
+ XUI_ScrollBox(\r
+ this,\r
+ XUI_Layout_Canvas,\r
+ [\r
+ {\r
+ width : '100%',\r
+ height : '100%'\r
+ },\r
+ X.UI.VBox.apply( 0, args )\r
+ ]\r
+ )\r
);\r
\r
attr && this.attr( attr );\r
OSDN Git Service
