\r
\r
-function X_UI_ScrollBox_momentum( current, start, time, lowerMargin, wrapperSize, deceleration ){\r
- var distance = current - start,\r
- speed = Math.abs( distance ) / time,\r
- destination,\r
- duration;\r
-\r
- deceleration = deceleration === undefined ? 0.0006 : deceleration;\r
-\r
- destination = current + ( speed * speed ) / ( 2 * deceleration ) * ( distance < 0 ? -1 : 1 );\r
- duration = speed / deceleration;\r
-\r
- if( destination < lowerMargin ){\r
- destination = wrapperSize ? lowerMargin - ( wrapperSize / 2.5 * ( speed / 8 ) ) : lowerMargin;\r
- distance = Math.abs( destination - current );\r
- duration = distance / speed;\r
- } else\r
- if ( destination > 0 ) {\r
- destination = wrapperSize ? wrapperSize / 2.5 * ( speed / 8 ) : 0;\r
- distance = Math.abs( current ) + destination;\r
- duration = distance / speed;\r
- };\r
-\r
- return {\r
- destination : Math.round( destination ),\r
- duration : duration\r
- };\r
-};\r
\r
var X_UI_ScrollBox_SUPPORT_ATTRS = {\r
// スクロール開始するために必要な移動距離、縦か横、どちらか制限する場合、より重要\r
scrollYEnabled : [ true, XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.BOOLEAN ],\r
scrollEnabled : [ true, XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.BOOLEAN ],\r
bounceEnabled : [ true, XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.BOOLEAN ],\r
- bounceTime : [ 600, XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.TIME ],\r
+ bounceTime : [ 300, XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.TIME ],\r
useWheel : [ true, XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.BOOLEAN ],\r
useKey : [ true, XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.BOOLEAN ],\r
hasScrollShadow : [ true, XUI_Dirty.CLEAN, XUI_Attr_USER.UINODE, XUI_Attr_Type.BOOLEAN ],\r
\r
var XUI_ScrollBox = XUI_ChromeBox.inherits(\r
'_ScrollBox',\r
- X_Class.PRIVATE_DATA,\r
+ X_Class.NONE,\r
{\r
+ layout : XUI_Layout_Canvas,\r
+ \r
directionLockThreshold : 10,\r
scrollXEnabled : true,\r
scrollYEnabled : true,\r
hasScrollShadow : true,\r
scrollShadowColor : '#000',\r
\r
- supportAttrs : XUI_Attr_createAttrDef( XUI_Attr_Support, X_UI_ScrollBox_SUPPORT_ATTRS ),\r
- \r
scrolling : false,\r
\r
initiated : '',\r
directionLocked : '',\r
startTime : 0,\r
endTime : 0,\r
- isAnimating : false,\r
isInTransition : false,\r
\r
hasHScroll : false,\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
function X_UI_ScrollBox_onLayoutComplete( e ){\r
// scroll の停止、GPU の解除\r
var font = this.fontSize = this.xnodeSlider.call( 'fontSize' );\r
- \r
- this.scrollXMax = ( this.boxWidth - this._containerNode.boxWidth ) * font;\r
- this.scrollYMax = ( this.boxHeight - this._containerNode.boxHeight ) * font;\r
\r
- this.hasHScroll = this.scrollXEnabled && this.scrollXMax < 0;\r
- this.hasVScroll = this.scrollYEnabled && this.scrollYMax < 0;\r
+ this.scrollXMax = ( this.boxWidth - this._containerNode.boxWidth ) * font | 0;\r
+ this.scrollYMax = ( this.boxHeight - this._containerNode.boxHeight ) * font | 0;\r
+\r
+ this.hasHScroll = this.scrollXEnabled && ( this.scrollXMax < -1 ); // < 0 だと \r
+ this.hasVScroll = this.scrollYEnabled && ( this.scrollYMax < -1 );\r
\r
if( !this.hasHScroll ){\r
this.scrollXMax = 0;\r
this.startTime = X_Timer_now();\r
\r
// スクロール中の停止\r
- if( this.isInTransition || this.isAnimating ){\r
- this.isInTransition = this.isAnimating = false;\r
+ if( this.isInTransition ){\r
+ this.isInTransition = false;\r
this[ 'dispatch' ]( XUI_Event.SCROLL_END );\r
+ // TODO current位置\r
this.xnodeSlider.stop();\r
}; \r
\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
return false;\r
};\r
\r
- //console.log( 'バウンド!' );\r
- //console.log( 'rese x:' + x + ' y:' + y );\r
+ console.log( ' ===> resetPosition - バウンド!' );\r
+ console.log( ' x:' + x + ' y:' + y );\r
that.scrollTo( x, y, time, that.bounceEasing, 1000 );\r
\r
return true;\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
+function X_UI_ScrollBox_momentum( current, start, time, lowerMargin, wrapperSize, deceleration ){\r
+ var distance = current - start,\r
+ speed = Math.abs( distance ) / time,\r
+ destination,\r
+ duration;\r
+\r
+ deceleration = deceleration === undefined ? 0.0006 : deceleration;\r
+\r
+ destination = current + ( speed * speed ) / ( 2 * deceleration ) * ( distance < 0 ? -1 : 1 );\r
+ duration = speed / deceleration;\r
+\r
+ if( destination < lowerMargin ){\r
+ destination = wrapperSize ? lowerMargin - ( wrapperSize / 2.5 * ( speed / 8 ) ) : lowerMargin;\r
+ distance = Math.abs( destination - current );\r
+ duration = distance / speed;\r
+ } else\r
+ if ( destination > 0 ) {\r
+ destination = wrapperSize ? wrapperSize / 2.5 * ( speed / 8 ) : 0;\r
+ distance = Math.abs( current ) + destination;\r
+ duration = distance / speed;\r
+ };\r
+\r
+ return {\r
+ destination : Math.round( destination ),\r
+ duration : duration\r
+ };\r
+};\r
+\r
X.UI.ScrollBox = X.UI.ChromeBox.inherits(\r
'ScrollBox',\r
X_Class.NONE,\r
- XUI_ScrollBox,\r
{\r
Constructor : function(){\r
+ var supports, slider;\r
+ \r
+ if( XUI_ScrollBox.prototype.usableAttrs === XUI_ChromeBox.prototype.usableAttrs ){\r
+ XUI_ScrollBox.prototype.usableAttrs = supports = XUI_Attr_createAttrDef( XUI_Attr_Support, X_UI_ScrollBox_SUPPORT_ATTRS );\r
+ \r
+ XUI_ScrollBox.prototype.attrClass = XUI_Attr_preset( XUI_Box.prototype.attrClass, supports, { width : '100%', height : '100%', bgColor : 0x111111 } );\r
+ };\r
+ \r
var args = [\r
XUI_Layout_Vertical, \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
- arg, layout, attr;\r
+ arg, attr;\r
\r
for( ; i; ){\r
arg = arguments[ --i ];\r
if( arg[ 'instanceOf' ] && arg[ 'instanceOf' ]( XUI_LayoutBase ) ){\r
- layout = arg;\r
+ args[ 0 ] = arg;\r
} else\r
if( arg[ 'instanceOf' ] && arg[ 'instanceOf' ]( X.UI.AbstractUINode ) ){\r
args[ args.length ] = arg;\r
} else\r
if( X_Type_isObject( arg ) ){\r
- attr = arg;\r
+ args[ args.length ] = attr = arg;\r
+ slider = attr.scrollSlider;\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
+ null,\r
+ [\r
+ slider || X.UI.VBox.apply( 0, args )\r
+ ]\r
+ )\r
);\r
\r
- attr && this.attr( attr );\r
+ //attr && this.attr( attr );\r
},\r
scrollX : function(){\r
\r
\r
}\r
}\r
-);
\ No newline at end of file
+);\r
+\r