X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.6.x%2Fjs%2F20_ui%2F20_Root.js;h=bd1a84b4df5fcf508caaa48a0f02e1570a7dffb5;hb=HEAD;hp=237af6ae7ae76c2254e093f8d4abab725bedd9bb;hpb=74f0206369c34768338a44ad8442a7bcdf7d5a7e;p=pettanr%2FclientJs.git

diff --git a/0.6.x/js/20_ui/20_Root.js b/0.6.x/js/20_ui/20_Root.js
index 237af6a..bd1a84b 100644
--- a/0.6.x/js/20_ui/20_Root.js
+++ b/0.6.x/js/20_ui/20_Root.js
@@ -1,81 +1,112 @@
-var X_UI_rootData  = null,
-	XUI_xnodeIneraction = null,
-	XUI_interactionBusy = false;
+var XUI_rootData         = null,
+	XUI_xnodeIneraction  = null,
+	XUI_mousemoveFix     = X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ],
+	XUI_mousemoveFixOn   = 0,
+	XUI_mousemoveFixX    = 0,
+	XUI_mousemoveFixY    = 0,
+	XUI_mousemoveFixLast = null,
+	XUI_UINODES_HOVER    = [],
+	XUI_EVENT_COUNTER    = {},
+	XUI_uinodeTarget     = null,
+	XUI_xnodeInteractionOverlay,
+	XUI_interactionBusy  = false;
+
+function XUI_mousemoveFixResetScroll(){
+	var raw = XUI_xnodeInteractionOverlay[ '_rawObject' ];
+
+	if( XUI_mousemoveFix ){
+		XUI_mousemoveFixX = raw.scrollLeft = raw.offsetWidth;
+		XUI_mousemoveFixY = raw.scrollTop  = raw.offsetHeight;		
+	};
+};
+
+function XUI_mousemoveFixScrollEnd(){
+	var raw  = XUI_xnodeInteractionOverlay[ '_rawObject' ];
+
+	XUI_mousemoveFixOn = 0;
+	XUI_mousemoveFixLast.type = 'pointerup';
+	X_UI_eventRellay( XUI_mousemoveFixLast );
+	
+	raw.scrollLeft = XUI_mousemoveFixX;
+	raw.scrollTop  = XUI_mousemoveFixY;
+};
 
 function X_UI_eventRellay( e ){
 	var font    = X_ViewPort_baseFontSize,
-		x       = e.pageX / font, // clientX は iOS4- で通らない？
-		y       = e.pageY / font,
+		x       = e.pageX, // clientX は iOS4- で通らない？
+		y       = e.pageY,
 		type    = XUI_Event.NameToID[ e.type ],
 		i       = 0,
-		data    = X_UI_rootData,
+		data    = XUI_rootData,
 		sysOnly = false,
 		ret     = X_CALLBACK_NONE,
-		list, parent, _ret, eventIn, eventOut;
+		list    = XUI_UINODES_HOVER,
+		raw, parent, _ret, eventIn, eventOut;
 
-	// mouseup で　alert を出すと　mouseleave が発生、ということでイベント中のイベント発火を禁止
-	if( !data || XUI_interactionBusy ) return ret;
-	XUI_interactionBusy = true;
+	// mouseup で alert を出すと mouseleave が発生、ということでイベント中のイベント発火を禁止
+	if( XUI_interactionBusy ) return ret;
 	
-	if( type !== XUI_Event._POINTER_MOVE ){
-		console.log( data.xnode.className() + '>' + e.type + ' ' + type + ' x:' + x + ', y:' + y );
-		//console.dir( data )
-		//data !== X_UI_rootData && console.log( ( data.xnode[ 'className' ]() + data.xnode[ 'text' ]() ).substr( 0, 15 ) );
-	};
-	
-	e.type = type;
+	XUI_interactionBusy = true;
 
-	// TODO capture は pointer 毎に!
+	if( XUI_mousemoveFix ){
+		if( e.type === 'scroll' ){
+			raw  = XUI_xnodeInteractionOverlay[ '_rawObject' ];
+			type = XUI_mousemoveFixOn ? XUI_Event._POINTER_MOVE : XUI_Event._POINTER_DOWN;
+			x    = XUI_mousemoveFixX - raw.scrollLeft;
+			y    = XUI_mousemoveFixY - raw.scrollTop;
+			e.pageX = x;
+			e.pageY = y;
+			e[ 'button' ]      = 0;
+			e[ 'timestamp' ]   = e[ 'timeStamp' ];
+			e[ 'pointerId' ]   = 1;
+			e[ 'pointerType' ] = 'mouse';
 
-	
-	list = X_UI_rootData.hoverList;
-	( X_UI_rootData.targetNodeData = X_UI_rootData ).capcher( x, y );
-	data = X_UI_rootData.targetNodeData;
+			XUI_mousemoveFixOn && X_Timer_remove( XUI_mousemoveFixOn );
+			XUI_mousemoveFixOn   = X_Timer_once( 250, XUI_mousemoveFixScrollEnd );
+			XUI_mousemoveFixLast = X_Object_copy( e );
+		};
+	};
 
+	e = X_Object_copy( e );
+	e.type = type;
 
+	// capture は pointer 毎に!
+	data.capcher( x / font, y / font );
+	data = XUI_uinodeTarget || data;
 
-	
-	
-	while( true ){
-		_ret = data[ 'dispatch' ]( e, sysOnly );
+	while( data ){
+		_ret = data[ 'dispatch' ]( e, sysOnly ) || X_CALLBACK_NONE;
 		ret |= _ret;
-		if( X_UI_rootData !== data && _ret & X_CALLBACK_CAPTURE_POINTER ){
-			X_UI_rootData.monopolyNodeData = data;
-			break;
-		};
-		if( X_UI_rootData.monopolyNodeData === data ) X_UI_rootData.monopolyNodeData = null;
 		if( type < XUI_Event._START_BUBLEUP || ret & X_CALLBACK_STOP_PROPAGATION ){
 			break;
 		};
-		if( !data.parentData ) break;
 		data = data.parentData;
-		if( type !== XUI_Event._POINTER_MOVE ){
-			//data !== X_UI_rootData && console.log( ( data.xnode[ 'className' ]() + data.xnode[ 'text' ]() ).substr( 0, 15 ) );
-		};
 	};
-	if( data !== X_UI_rootData ) ret |= X_UI_rootData[ 'dispatch' ]( e, sysOnly );
 
-	eventOut = X_Object_copy( e );
-	eventOut.type = XUI_Event.POINTER_OUT;
-
-	eventIn = X_Object_copy( e );
-	eventIn.type = XUI_Event.POINTER_IN;
-	
 	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' ]( eventOut, 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' ]( eventIn, 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;
 		};
 	};
@@ -84,8 +115,8 @@ function X_UI_eventRellay( e ){
 };
 
 function X_UI_onMouseOut( e ){
-	var list = X_UI_rootData.hoverList,
-		i = list.length;
+	var list = XUI_UINODES_HOVER,
+		i = list.length, data;
 	console.log( 'pointer out!!' + e.type + i + ' ' + e.pointerType );
 
 	e = X_Object_copy( e );
@@ -93,8 +124,6 @@ function X_UI_onMouseOut( e ){
 	
 	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' ]( e, false ); // new Event
 		delete data.hovering;
 	};
@@ -113,12 +142,7 @@ var XUI_Root = XUI_Box.inherits(
 		layout                : XUI_Layout_Canvas,
 		
 		calcReserved          : false,
-		hoverList             : null,
-		targetNodeData        : null,
-		monopolyNodeData      : null,
 		
-		xnodeInteractiveLayer : null,
-		eventCounter          : null,
 		cursorStyle           : null,
 		
 		Constructor : function( user, layout, args ){
@@ -130,39 +154,38 @@ var XUI_Root = XUI_Box.inherits(
 				X_ViewPort[ 'listenOnce' ]( X_EVENT_XDOM_READY, this, this.start );
 			};
 			
-			this.hoverList    = [];
-			this.eventCounter = {};
-			
-			X_UI_rootData = this;
+			XUI_rootData = this;
 		},
 		
 		start : function(){
-			// hover や rollover rollout のための move イベントの追加
-			// TODO この切り替えを ViewPort へ
-			XUI_xnodeIneraction = ( X_UA[ 'IE' ] < 9 ? X_ViewPort_document : X_UA[ 'Opera' ] < 8 ? X_Node_body : X_ViewPort );	
-			
 			this.initialize( this.User, this, null, null );
 			X_Timer_once( 0, this, this.addToView );
 		},
 		addToView : function(){
-			var	counter = this.eventCounter;
-			
-			// this.xnodeInteractiveLayer の前に追加する！
-
+			// XUI_xnodeInteractionOverlay の前に追加する！
 			this.addToParent( X_Node_body );
-			
-			this.xnodeInteractiveLayer = X_Node_body.create( 'div', {
-				'class'      : 'mouse-operation-catcher',
+
+			XUI_xnodeInteractionOverlay = X_Node_body.create( 'div', {
+				'class'      : XUI_mousemoveFix ? 'mouse-operation-catcher-scrollFix' : 'mouse-operation-catcher',
 				unselectable : 'on'
 			} );
 			
 			X_Node_body[ 'listen' ]( 'pointerleave', this, X_UI_onMouseOut );
 			
-			XUI_xnodeIneraction[ 'listen' ]( 'pointermove', X_UI_eventRellay );
-			if( counter[ XUI_Event._POINTER_MOVE ] ){
-				++counter[ XUI_Event._POINTER_MOVE ];
+			// hover や rollover rollout のための move イベントの追加
+			// TODO この切り替えを ViewPort へ
+			XUI_xnodeIneraction = ( X_UA[ 'IE' ] < 9 ? X_ViewPort_document : X_UA[ 'Opera' ] < 8 ? X_Node_body : X_ViewPort );
+			
+			if( XUI_mousemoveFix ){
+				XUI_xnodeInteractionOverlay[ 'listen' ]( [ 'scroll', 'mouseup' ], X_UI_eventRellay )[ 'create' ]( 'div' );
 			} else {
-				counter[ XUI_Event._POINTER_MOVE ] = 1;
+				XUI_xnodeIneraction[ 'listen' ]( 'pointermove', X_UI_eventRellay );
+			};
+			
+			if( XUI_EVENT_COUNTER[ XUI_Event._POINTER_MOVE ] ){
+				++XUI_EVENT_COUNTER[ XUI_Event._POINTER_MOVE ];
+			} else {
+				XUI_EVENT_COUNTER[ XUI_Event._POINTER_MOVE ] = 1;
 			};
 
 			X_Timer_once( 0, this, this.afterAddToView );
@@ -175,7 +198,7 @@ var XUI_Root = XUI_Box.inherits(
 		},
 		
 		reserveCalc : function(){
-			if( this.calcReserved === false ){
+			if( !this.calcReserved ){
 				this.calcReserved = true;
 				X_Timer_once( 0, this, this.calculate );
 			};
@@ -185,28 +208,33 @@ var XUI_Root = XUI_Box.inherits(
 				size, font, w, h;
 			
 			if( ( this[ 'dispatch' ]( { type : XUI_Event.LAYOUT_BEFORE, 'cancelable' : cancelable } ) & X_CALLBACK_PREVENT_DEFAULT ) && cancelable ){
+				console.log( 'Layout のキャンセル' );
 				return X_CALLBACK_NONE;
 			};
 			
+			console.log( 'レイアウト開始' );
+			
+			XUI_mousemoveFix && XUI_mousemoveFixResetScroll();
+			
 			size = X[ 'ViewPort' ][ 'getSize' ]();
 			font = X[ 'ViewPort' ][ 'getBaseFontSize' ]();
 			this.layout.calculate( this, false, 0, 0, size[ 0 ] / font, size[ 1 ] / font );
 			this.updateLayout();
 			
 			this.calcReserved = false;
-			
-			X_ViewPort[ 'listenOnce' ]( X_EVENT_AFTER_UPDATE, this, XUI_Root_onViewUpdate );
-			
+
+			// size を測りながらレイアウトする結果、アップデートがない場合がある
+			if( X_Node_updateTimerID ){
+				X_ViewPort[ 'listenOnce' ]( X_EVENT_AFTER_UPDATE, this, XUI_Root_onViewUpdate );
+			} else {
+				this[ 'asyncDispatch' ]( XUI_Event.LAYOUT_COMPLETE );
+			};
+
 			return X_CALLBACK_NONE;
 		},
 		
 		updateCoursor : function( cursor ){
 			
-		},
-		
-		_remove : function(){
-			X_EventDispatcher_unlistenAll( this.xnodeInteractiveLayer );
-			_Box.prototype._remove.call( this );
 		}
 	}
 );
@@ -220,6 +248,7 @@ function XUI_Root_do1stCalculate(){
 };
 
 function XUI_Root_onViewUpdate( e ){
+	console.log( 'レイアウト完了' );
 	this[ 'dispatch' ]( XUI_Event.LAYOUT_COMPLETE );
 };
 
@@ -235,7 +264,7 @@ X.UI.Root = X.UI.Box.inherits(
 			//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%',