-var X_UI_rootData = null,
- X_UI_eventBusy = false;
+var XUI_rootData = null,
+ XUI_xnodeIneraction = null,
+ XUI_UINODES_HOVER = [],
+ XUI_EVENT_COUNTER = {},
+ XUI_uinodeTarget = null,
+ XUI_xnodeInteractionOverlay,
+ XUI_interactionBusy = false;
function X_UI_eventRellay( e ){
var font = X_ViewPort_baseFontSize,
y = e.pageY / font,
type = XUI_Event.NameToID[ e.type ],
i = 0,
- data = X_UI_rootData,
+ data = XUI_rootData,
sysOnly = false,
ret = X_CALLBACK_NONE,
- list, parent, _ret;
+ list, parent, _ret, eventIn, eventOut;
// mouseup で alert を出すと mouseleave が発生、ということでイベント中のイベント発火を禁止
- if( !data || X_UI_eventBusy ) return ret;
- data._eventBusy = true;
+ if( !data || XUI_interactionBusy ) return ret;
- if( type !== '' + XUI_Event._POINTER_MOVE ){
- //console.log( e.type + ' ' + type + ' x:' + x + ', y:' + y );
- };
-
- e.type = type;
+ XUI_interactionBusy = true;
- if( data && ( data = data.monopolyNodeData ) && ( ret = data[ 'dispatch' ]( e ) ) & X_CALLBACK_CAPTURE_POINTER ){
- X_UI_eventBusy = false;
- return ret | X_CALLBACK_PREVENT_DEFAULT;
- };
-
- list = X_UI_rootData.hoverList;
- ( X_UI_rootData.targetNodeData = X_UI_rootData ).capcher( x, y );
- data = X_UI_rootData.targetNodeData;
+ e = X_Object_copy( e );
+ e.type = type;
- //data !== X_UI_rootData && console.log( data.xnode[ 'text' ]() );
+ // TODO capture は pointer 毎に!
+ list = XUI_UINODES_HOVER;
+ ( XUI_uinodeTarget = XUI_rootData ).capcher( x, y );
+ data = XUI_uinodeTarget;
while( data ){
_ret = data[ 'dispatch' ]( e, sysOnly );
ret |= _ret;
- if( _ret & X_CALLBACK_CAPTURE_POINTER || _ret & X_CALLBACK_STOP_PROPAGATION || _ret & X_CALLBACK_STOP_NOW ) break; // sysOnly = true;
+ if( type < XUI_Event._START_BUBLEUP || ret & X_CALLBACK_STOP_PROPAGATION ){
+ break;
+ };
data = data.parentData;
};
-
+
for( i = list.length; i; ){
parent = data = list[ --i ];
while( parent.parentData && parent === parent.parentData.hitChildData ){
parent = parent.parentData;
};
- 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
+ if( parent !== XUI_rootData ){
+ if( data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_OUT ] ){
+ if( !eventOut ){
+ eventOut = X_Object_copy( e );
+ eventOut.type = XUI_Event.POINTER_OUT;
+ };
+ data[ 'dispatch' ]( eventOut, false );
+ };
delete data.hovering;
list.splice( i, 1 );
- continue;
- };
+ } else
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
+ if( data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_IN ] ){
+ if( !eventIn ){
+ eventIn = X_Object_copy( e );
+ eventIn.type = XUI_Event.POINTER_IN;
+ };
+ data[ 'dispatch' ]( eventIn, true );
+ };
data.hovering = true;
};
};
- X_UI_eventBusy = false;
+ XUI_interactionBusy = false;
return ret | X_CALLBACK_PREVENT_DEFAULT;
};
+function X_UI_onMouseOut( e ){
+ var list = XUI_UINODES_HOVER,
+ i = list.length;
+ console.log( 'pointer out!!' + e.type + i + ' ' + e.pointerType );
+
+ e = X_Object_copy( e );
+ e.type = XUI_Event.POINTER_OUT;
+
+ for( ; i; ){
+ data = list[ --i ];
+ data[ '_listeners' ] && data[ '_listeners' ][ XUI_Event.POINTER_OUT ] && data[ 'dispatch' ]( e, false ); // new Event
+ delete data.hovering;
+ };
+ list.length = 0;
+};
+
/*
* body が存在したら要素を作成、css も指定
* 背景画像を読み終える onload で活動開始
layout : XUI_Layout_Canvas,
calcReserved : false,
- hoverList : null,
- targetNodeData : null,
- monopolyNodeData : null,
- xnodeInteractiveLayer : null,
- eventCounter : null,
cursorStyle : null,
Constructor : function( user, layout, args ){
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.eventCounter = {};
-
- X_UI_rootData = this;
+ XUI_rootData = this;
},
start : function(){
+
+
this.initialize( this.User, this, null, null );
X_Timer_once( 0, this, this.addToView );
},
addToView : function(){
- var counter = this.eventCounter, flg;
-
- // this.xnodeInteractiveLayer の前に追加する！
-
- this.addToParent( X.Doc.body );
+ // XUI_xnodeInteractionOverlay の前に追加する！
+ this.addToParent( X_Node_body );
- this.xnodeInteractiveLayer = X.Doc.body.create( 'div', {
+ XUI_xnodeInteractionOverlay = X_Node_body.create( 'div', {
'class' : 'mouse-operation-catcher',
unselectable : 'on'
} );
+ X_Node_body[ 'listen' ]( 'pointerleave', this, X_UI_onMouseOut );
+
// hover や rollover rollout のための move イベントの追加
- ( 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 ];
+ // TODO この切り替えを ViewPort へ
+ XUI_xnodeIneraction = ( X_UA[ 'IE' ] < 9 ? X_ViewPort_document : X_UA[ 'Opera' ] < 8 ? X_Node_body : X_ViewPort );
+ XUI_xnodeIneraction[ 'listen' ]( 'pointermove', X_UI_eventRellay );
+
+ if( XUI_EVENT_COUNTER[ XUI_Event._POINTER_MOVE ] ){
+ ++XUI_EVENT_COUNTER[ XUI_Event._POINTER_MOVE ];
} else {
- counter[ XUI_Event._POINTER_MOVE ] = 1;
+ XUI_EVENT_COUNTER[ XUI_Event._POINTER_MOVE ] = 1;
};
X_Timer_once( 0, this, this.afterAddToView );
var cancelable = !e || ( e.type !== X_EVENT_VIEW_RESIZED && e.type !== X_EVENT_BASE_FONT_RESIZED ),
size, font, w, h;
- if( this[ 'dispatch' ]( { type : XUI_Event.LAYOUT_BEFORE, 'cancelable' : cancelable } ) & X_CALLBACK_PREVENT_DEFAULT && cancelable ){
+ if( ( this[ 'dispatch' ]( { type : XUI_Event.LAYOUT_BEFORE, 'cancelable' : cancelable } ) & X_CALLBACK_PREVENT_DEFAULT ) && cancelable ){
return X_CALLBACK_NONE;
};
},
_remove : function(){
- X_EventDispatcher_unlistenAll( this.xnodeInteractiveLayer );
+ X_EventDispatcher_unlistenAll( XUI_xnodeInteractionOverlay );
_Box.prototype._remove.call( this );
}
}
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 );
};
//if( !XUI_Root ){
supports = XUI_Attr_createAttrDef( XUI_Box.prototype.usableAttrs, XUI_Layout_Canvas.overrideAttrsForSelf );
- XUI_Root.prototype.layout = XUI_Layout_Canvas;
+ //XUI_Root.prototype.layout = XUI_Layout_Canvas;
XUI_Root.prototype.usableAttrs = supports;
XUI_Root.prototype.attrClass = XUI_Attr_preset( XUI_Box.prototype.attrClass, supports, {
width : '100%',
OSDN Git Service
