'mouseup' : 'pointerup',\r
'touchmove' : 'pointermove',\r
'mousemove' : 'pointermove',\r
+ 'touchleave' : 'pointerleave',\r
+ 'mouseout' : 'pointerleave',\r
+ 'mouseleave' : 'pointerleave',\r
'touchcancel' : 'pointercancel',\r
'contextmenu' : 'contextmenu',\r
'dbclick' : 'dbclick',\r
'mousedown' : 'pointerdown',\r
'mouseup' : 'pointerup',\r
'mousemove' : 'pointermove',\r
+ 'mouseout' : 'pointerleave',\r
+ 'mouseleave' : 'pointerleave',\r
'contextmenu' : 'contextmenu',\r
'dbclick' : 'dbclick',\r
'click' : 'click'\r
\r
// iOS と MacOSX Iron36 で発生。連続してアニメーションが起こると、クロージャの束縛された obj へのアクセスに失敗する。Win では起きない?\r
// むしろ、MacOSX のブラウザ全般で起こる??\r
- X_EventDispatcher_ANIME_EVENTS = ( X_UA[ 'WebKit' ] || X_UA[ 'Blink' ] ) && {\r
+ X_EventDispatcher_ANIME_EVENTS = false && ( X_UA[ 'WebKit' ] || X_UA[ 'Blink' ] ) && {\r
'transitionend' : true, 'webkitTransitionEnd' : true, 'mozTransitionEnd' : true, 'oTransitionEnd' : true, 'otransitionEnd' : true,\r
'animationend' : true, 'webkitAnimationEnd' : true, 'oAnimationEnd' : true,\r
'animationstart' : true, 'webkitAnimationStart' : true, 'oAnimationStart' : true,\r
X_Event_Rename[ 'pointerup' ] = 'MSPointerUp';\r
X_Event_Rename[ 'pointermove' ] = [ 'MSPointerMove', 'MSPointerHover' ];// ie10 と ie11 でペンのhoverevent の値が異なる\r
X_Event_Rename[ 'pointercancel' ] = 'MSPointerCancel';\r
+ X_Event_Rename[ 'pointerout' ] = 'MSPointerOut';\r
+ X_Event_Rename[ 'pointerleave' ] = 'MSPointerLeave';\r
// http://msdn.microsoft.com/ja-jp/library/ie/dn304886%28v=vs.85%29.aspx\r
} else\r
if( X_UA_HID.TOUCH ){\r
X_Event_Rename[ 'pointerup' ] = [ 'touchend', 'mouseup' ];\r
X_Event_Rename[ 'pointermove' ] = [ 'touchmove', 'mousemove' ];\r
X_Event_Rename[ 'pointercancel' ] = 'touchcancel';\r
+ X_Event_Rename[ 'pointerout' ] = \r
+ X_Event_Rename[ 'pointerleave' ] = 'touchleave';\r
// X_Event_Rename[ 'click' ] = [ 'touchstart', 'touchmove', 'touchend' ]; // ループになってしまう!直した!直ってない!\r
} else {\r
X_Event_Rename[ 'pointerdown' ] = 'mousedown';\r
X_Event_Rename[ 'pointerup' ] = 'mouseup';\r
X_Event_Rename[ 'pointermove' ] = 'mousemove';\r
- X_Event_Rename[ 'pointercancel' ] = document.documentElement.onmouseleave !== undefined ? 'mouseleave' : 'mouseout';//??\r
+ X_Event_Rename[ 'pointercancel' ] = \r
+ X_Event_Rename[ 'pointerleave' ] = \r
+ X_Event_Rename[ 'pointerleave' ] = document.documentElement.onmouseleave !== undefined ? 'mouseleave' : 'mouseout';\r
\r
// Opera は ブラウザ設定から右クリックの通知を許可すると mousedown で e.button==2 が返る,キャンセルは可能??\r
X_UA[ 'Opera' ] && ( X_Event_Rename[ 'contextmenu' ] = 'mousedown' );\r
};\r
\r
function X_Node_Anime_updatePosition( xnode, x, y, opacity, useGPU ){\r
- console.log( 'updatePosition x:' + x + ' gpu:' + !!useGPU );\r
+ //console.log( 'updatePosition x:' + x + ' gpu:' + !!useGPU );\r
if( X_Node_Anime_hasTransform ){\r
xnode[ 'css' ]({\r
transform : 'translate(' + ( x | 0 ) + 'px,' + ( y | 0 ) + 'px)' + ( useGPU ? X_Node_Anime_translateZ : '' ),\r
opacity : opacity\r
});\r
} else {\r
- x === x && xnode[ 'css' ]({\r
- left : ( x | 0 ) + 'px',\r
- opacity : opacity });\r
- y === y && xnode[ 'css' ]({\r
- top : ( y | 0 ) + 'px',\r
- opacity : opacity });\r
+ x === x && xnode[ 'css' ]( 'left', ( x | 0 ) + 'px' );\r
+ y === y && xnode[ 'css' ]( 'top', ( y | 0 ) + 'px' );\r
+ opacity === opacity && xnode[ 'css' ]( 'opacity', opacity );\r
};\r
\r
if( X_Node_Anime_translateZ ){\r
xnode[ '_flags' ] &= X_Node_BitMask_RESET_GPU;\r
xnode[ '_flags' ] |= X_NodeFlags_GPU_NOW;\r
} else\r
- if( xnode[ '_flags' ] & X_NodeFlags_GPU_NOW ){\r
- } else {\r
+ if( !( xnode[ '_flags' ] & X_NodeFlags_GPU_NOW ) ){\r
xnode[ '_flags' ] &= X_Node_BitMask_RESET_GPU;\r
xnode[ '_flags' ] |= X_NodeFlags_GPU_RESERVED;\r
};\r
} else {\r
if( xnode[ '_flags' ] & X_NodeFlags_GPU_NOW ){\r
xnode[ '_flags' ] &= X_Node_BitMask_RESET_GPU;\r
- xnode[ '_flags' ] |= X_NodeFlags_GPU_RELEASE_RESERVED; \r
+ xnode[ '_flags' ] |= X_NodeFlags_GPU_RELEASE_RESERVED;\r
} else\r
if( xnode[ '_flags' ] & X_NodeFlags_GPU_RESERVED ){\r
xnode[ '_flags' ] &= X_Node_BitMask_RESET_GPU;\r
\r
delete xnode[ '_anime' ];\r
X_Node_ANIMATIONS.splice( i, 1 );\r
- \r
+ console.log( obj.destA );\r
// filter な 親が解除されないと子要素への filter が反映されない\r
xnode[ 'asyncDispatch' ]( { type : X_EVENT_ANIME_END, 'gpu' : false } );\r
} else {\r
obj.x = newX;\r
obj.y = newY;\r
obj.a = newA;\r
- c = true; \r
+ c = true;\r
};\r
};\r
\r
- c && console.log( 'anime... ' + X_Node_updateTimerID );\r
+ //c && console.log( 'anime... ' + X_Node_updateTimerID );\r
\r
if( X_Node_Anime_reserved = c ){\r
if( X_Node_updateTimerID ){\r
/* Rellay */\r
initialize : function( root, rootData, parent, parentData ){\r
var uinodes = this.uinodes,\r
- i = uinodes && uinodes.length;\r
+ l = uinodes && uinodes.length, i = 0;\r
\r
- if( i ){\r
- for( ; i; ){\r
- uinodes[ --i ].initialize( root, rootData, this.User, this );\r
- }; \r
+ for( ; i < l; ++i ){\r
+ uinodes[ i ].initialize( root, rootData, this.User, this );\r
};\r
\r
XUI_AbstractUINode.prototype.initialize.apply( this, arguments );\r
addToParent : function( parentXNode ){\r
var uinodes = this.uinodes,\r
l = uinodes && uinodes.length,\r
- i;\r
+ i = 0;\r
\r
- if( l ){\r
- for( i = 0; i < l; ++i ){\r
- uinodes[ i ].addToParent( this.xnode );\r
- };\r
+ for( ; i < l; ++i ){\r
+ uinodes[ i ].addToParent( this.xnode );\r
};\r
\r
XUI_AbstractUINode.prototype.addToParent.apply( this, arguments );\r
/* Rellay */\r
creationComplete : function(){\r
var uinodes = this.uinodes,\r
- i = uinodes && uinodes.length;\r
- if( i ){\r
- for( ; i; ){\r
- uinodes[ --i ].creationComplete();\r
- }; \r
+ l = uinodes && uinodes.length,\r
+ i = 0;\r
+ \r
+ for( ; i < l; ++i ){\r
+ uinodes[ i ].creationComplete();\r
};\r
\r
XUI_AbstractUINode.prototype.creationComplete.apply( this, arguments );\r
switch( e.type ){\r
case X_EVENT_CANCELED :\r
case XUI_Event.SCROLL_END :\r
+ console.log( '-fadeout-' );\r
this[ 'animate' ](\r
{ opacity : 1 },\r
{ opacity : 0 },\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
+ this[ 'listen' ]( [ XUI_Event._POINTER_UP, XUI_Event.POINTER_OUT, XUI_Event._POINTER_CANCEL ], this, X_UI_ScrollBox_onEnd );\r
\r
return ret | X_CALLBACK_PREVENT_DEFAULT;\r
};\r
newX, newY,\r
momentumX, momentumY,\r
duration, distanceX, distanceY;\r
- \r
+ \r
+ console.log( e.type + ' onend ' + XUI_Event.POINTER_OUT );\r
+ \r
this[ 'unlisten' ]( XUI_Event._POINTER_MOVE, this, X_UI_ScrollBox_onMove );\r
- this[ 'unlisten' ]( [ XUI_Event._POINTER_UP, XUI_Event._POINTER_CANCEL ], this, X_UI_ScrollBox_onEnd );\r
+ this[ 'unlisten' ]( [ XUI_Event._POINTER_UP, XUI_Event.POINTER_OUT, XUI_Event._POINTER_CANCEL ], this, X_UI_ScrollBox_onEnd );\r
\r
if( !this.scrollEnabled || e.pointerType !== this.initiated ){\r
+ console.log( e.type + ' onend 1 ' + e.pointerType + ' ' + this.initiated );\r
return ret;\r
};\r
\r
\r
// reset if we are outside of the boundaries\r
if( X_UI_ScrollBox_resetPosition( this, this.bounceTime ) ){\r
+ console.log( e.type + ' onend 2 ' + XUI_Event.POINTER_OUT );\r
return ret;\r
};\r
\r
easing = 'quadratic';\r
};\r
\r
- console.log( 'end2 x:' + newX + ' y:' + newY + ' t:' + time );\r
+ console.log( 'end2 x:' + newX + ' y:' + newY + '<-y:' + this.scrollY + ' t:' + time );\r
this.scrollTo( newX, newY, time, easing, 1000 );\r
} else {\r
console.log( 'end1 x:' + newX + ' y:' + newY );\r
};\r
\r
function X_UI_ScrollBox_onAnimeEnd( e ){\r
+ if( e.target !== this.xnodeSlider ){\r
+ console.log( '- not much -' );\r
+ console.dir(e);\r
+ };\r
if( e.target === this.xnodeSlider && this.isInTransition && !X_UI_ScrollBox_resetPosition( this, this.bounceTime ) ){\r
this.isInTransition = false;\r
console.log( '-2-' );\r
this[ 'dispatch' ]( XUI_Event.SCROLL_END );\r
};\r
+ console.log(' -2.1- '+this.isInTransition );\r
return X_CALLBACK_NONE;\r
};\r
\r
minHeight : '100%'\r
}\r
],\r
- i = arguments.length,\r
+ l = arguments.length, i = 0, j = 1,\r
arg, attr;\r
\r
- for( ; i; ){\r
- arg = arguments[ --i ];\r
+ for( ; i < l; ++i ){\r
+ arg = arguments[ i ];\r
if( arg[ 'instanceOf' ] && arg[ 'instanceOf' ]( XUI_LayoutBase ) ){\r
args[ 0 ] = arg;\r
} else\r
if( arg[ 'instanceOf' ] && arg[ 'instanceOf' ]( X.UI.AbstractUINode ) ){\r
- args[ args.length ] = arg;\r
+ args[ ++j ] = arg;\r
} else\r
if( X_Type_isObject( arg ) ){\r
- args[ args.length ] = attr = arg;\r
+ args[ ++j ] = attr = arg;\r
slider = attr.scrollSlider;\r
};\r
};\r
};
if( parent !== X_UI_rootData ){
data.hoverClassName && data.xnode[ 'removeClass' ]( data.hoverClassName );
- data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_OUT ] && data[ 'dispatch' ]( e, XUI_Event.POINTER_OUT, false ); // new Event
+ data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_OUT ] && data[ 'dispatch' ]( XUI_Event.POINTER_OUT, false ); // new Event
delete data.hovering;
list.splice( i, 1 );
continue;
};
if( !data.hovering ){
data.hoverClassName && data.xnode.addClassName( data.hoverClassName );
- data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_IN ] && data[ 'dispatch' ]( e, XUI_Event.POINTER_IN, true ); // new Event
+ data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_IN ] && data[ 'dispatch' ]( XUI_Event.POINTER_IN, true ); // new Event
data.hovering = true;
};
};
return ret | X_CALLBACK_PREVENT_DEFAULT;
};
+function X_UI_onMouseOut( e ){
+ var list = X_UI_rootData.hoverList,
+ i = list.length;
+console.log( e.type + i + ' ' + e.pointerType )
+ for( ; i; ){
+ data = list[ --i ];
+ console.log( data.xnode.className() );
+ data.hoverClassName && data.xnode[ 'removeClass' ]( data.hoverClassName );
+ data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_OUT ] && data[ 'dispatch' ](
+ { type : XUI_Event.POINTER_OUT, pointerType : e.pointerType }, false ); // new Event
+ delete data.hovering;
+ };
+ list.length = 0;
+};
+
/*
* body が存在したら要素を作成、css も指定
* 背景画像を読み終える onload で活動開始
if( X_ViewPort_readyState === X_EVENT_XDOM_READY ){
X_Timer_once( 0, this, this.start );
} else {
- X.ViewPort[ 'listenOnce' ]( X_EVENT_XDOM_READY, this, this.start );
+ X_ViewPort[ 'listenOnce' ]( X_EVENT_XDOM_READY, this, this.start );
};
this.hoverList = [];
this.xnodeInteractiveLayer = X.Doc.body.create( 'div', {
'class' : 'mouse-operation-catcher',
unselectable : 'on'
- } );
+ } )[ 'listen' ]( 'pointerleave', this, X_UI_onMouseOut );
// hover や rollover rollout のための move イベントの追加
+ // TODO この切り替えを ViewPort へ
( X_UA[ 'IE' ] < 9 ? X_ViewPort_document : X_UA[ 'Opera' ] < 8 ? X_Node_body : X_ViewPort )[ 'listen' ]( 'pointermove', X_UI_eventRellay );
if( counter[ XUI_Event._POINTER_MOVE ] ){
++counter[ XUI_Event._POINTER_MOVE ];
function XUI_Root_do1stCalculate(){
this.calculate();
this.phase = 4;
- X.ViewPort
+ X_ViewPort
[ 'listen' ]( X_EVENT_VIEW_RESIZED, this, this.calculate )
[ 'listen' ]( X_EVENT_BASE_FONT_RESIZED, this, this.calculate );
};