X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.6.x%2Fjs%2F06_net%2F04_XNetImage.js;h=e93c46b439c0ecf5f2155a9c23c5bd881a3e43c0;hb=bfca1aa94da405643253af65c421f6665d6e6262;hp=6a90a4659b0b7cd5c20d1f3f9685377d2bf86fa3;hpb=7f26e99d39211b5749c4ad62a84855404c7390a3;p=pettanr%2FclientJs.git

diff --git a/0.6.x/js/06_net/04_XNetImage.js b/0.6.x/js/06_net/04_XNetImage.js
index 6a90a46..e93c46b 100644
--- a/0.6.x/js/06_net/04_XNetImage.js
+++ b/0.6.x/js/06_net/04_XNetImage.js
@@ -1,3 +1,4 @@
+//{+netimage"画像の読み込み監視"(Imageの読み込みを監視し画像表示のコントロールを行う)[+net,+utilimage]
 /* 
  * original
  *  LICENSE: MIT?
@@ -5,32 +6,34 @@
  *  AUTHOR: uupaa.js@gmail.com
  * 
  */
-
-var X_Net_Image_hasImage  = !!window[ 'Image' ],
-	X_Net_Image_image     = X_Net_Image_hasImage && new Image(),
+var X_ImgLoader_image     = window[ 'Image' ] && new Image(),
 	// IE では厳密には HTMLImageElement ではなく、appendChild してもサイズが取れず、removeChild に失敗する
-	X_Net_Image_isElement = !( X_UA.IE < 9 ) && X.Type.isHTMLElement( X_Net_Image_image );
-	
-
-if( !X_Net_Image_hasImage ){
-	alert( 'no Image!' );
-} else
-if( X_Net_Image_isElement ){
-	//alert( 'X_Net_Image_isElement ' + X_Net_Image_isElement );
-};
+	X_ImgLoader_isElement = !( X_UA[ 'IE' ] < 9 ) && X_Type_isHTMLElement( X_ImgLoader_image ),
+	// http://uupaa.hatenablog.com/entry/2013/12/17/171809
+	// お手軽に画像の読み込みをハンドリングする、今どきな方法
+	X_ImgLoader_0forError = !X_UA[ 'IE' ] || X_UA[ 'IE' ] === 11 || X_UA[ 'IEHost' ] === 11;
 
 /*
  * TODO
  * new Image() のときに Image オブジェクトを作るもの(IE8-)と、HTMLImageElement を作るものがある。
  * Image は、X.EventDispatcher で、<img> は X.Node で。 
- * 
- * Opera7 では毎回 image を作る必要あり、src が異なればOK?
  */
-X_NET_ImageWrapper = X_Class_override(
-	!X_Net_Image_isElement ? new X.EventDispatcher( X_Net_Image_image ) : new X.Node( X_Net_Image_image ),
-	{
 
-		_busy      : false,
+X_TEMP.X_ImgLoader_init = function(){
+	X_ImgLoader = X_Class_override(
+		X_ImgLoader_isElement ? Node( X_ImgLoader_image ) : X_EventDispatcher( X_ImgLoader_image ),
+		X_TEMP.X_ImgLoader_params
+	);
+	
+	X_ImgLoader[ 'listen' ]( [ 'load', 'error' /*, 'abort'*/ ], X_ImgLoader_handleEvent );
+	
+	delete X_TEMP.X_ImgLoader_init;
+	delete X_TEMP.X_ImgLoader_params;
+	
+	return X_ImgLoader;
+};
+
+X_TEMP.X_ImgLoader_params = {
 		tick       : 0,
 		timerID    : 0,
 		finish     : false,
@@ -39,103 +42,107 @@ X_NET_ImageWrapper = X_Class_override(
 		timeout    : 0,
 		
 		load : function( data ){
-			this._busy   = true;
-			this.abspath = X.URL.toAbsolutePath( data.url );
-			this.delay   = data.delay || 100;
-			this.timeout = data.timeout || 5000;
-			this.timerID = X.Timer.add( this.delay, 0, this, this._detect );
-			
-			//X_Net_Image_hasImage ? ( this._rawObject.src = this.abspath ) : this.attr( 'src', this.abspath );
-			/*
-			if( X_UA.Opera7 ){
-				X_EventDispatcher_toggleAllEvents( this, false );
-				this._rawObject = new Image();
-				X_EventDispatcher_toggleAllEvents( this, true );
-			}; */
-			
-			this._rawObject.src = this.abspath;
-			//alert( this._rawObject.src + ' ' + this._rawObject.complete );
-			if( X_UA.Opera7 && this._rawObject.complete ){
-				this.asyncDispatch( 'load' );
+			this.abspath = X_URL_toAbsolutePath( data[ 'url' ] );
+			this.delay   = data[ 'delay'   ] || 100;
+			this.timeout = data[ 'timeout' ] || 5000;
+
+			this[ '_rawObject' ].src = this.abspath;
+
+			if( X_UA[ 'Opera7' ] && this[ '_rawObject' ].complete ){
+				this[ 'asyncDispatch' ]( 'load' );
 			} else {
-				this.timerID = X.Timer.add( this.delay, 0, this, this._detect );
-			};
-			//alert( this._rawObject.src + ' ' + this._rawObject.complete );
-		},
-		
-		handleEvent : function( e ){
-			var size;
-			switch( e.type ){
-				case 'error' :
-				//case 'abort' : // TODO ??
-					if( this.finish ) return;
-					this._busy  = false;
-					this.finish  = true;
-					this.timerID && X.Timer.remove( this.timerID );
-					this.timerID = this.asyncDispatch( /*e.type === 'error' ?*/ X.Event.ERROR /*: X.Event.CANCELED*/ );
-					break;
-				case 'load' :
-				// if( finish === true ) return; // これがあると firefox3.6 で駄目、、、
-				// if( timer ) return; // これがあると safari3.2 で駄目、、、
-					this._busy  = false;
-					this.finish = true;
-					this.timerID && X.Timer.remove( this.timerID );
-					if( X_UA.Opera && !this._rawObject.complete ){
-						this.timerID = this.asyncDispatch( X.Event.ERROR );
-						return;
-					};
-					size = X.Util.Image.getActualDimension( !X_Net_Image_isElement ? this.abspath : this );
-					this.timerID = this.asyncDispatch( {
-						type : X.Event.SUCCESS,
-						src  : this.abspath,
-						w    : size[ 0 ],
-						h    : size[ 1 ]
-					} );
-					break;
-				case X.Event.KILL_INSTANCE :
-					this.reset();
-					!X_Net_Image_hasImage && this.destroy(); // if xnode
-					break;
-			};
-		},
-		
-		_detect : function(){
-			if( this.finish ) return;
-			if( this._rawObject && this._rawObject.complete ){
-				this._busy  = false;
-				this.finish = true;
-				if( this._rawObject.width ) return;
-				X.Timer.remove( this.timerID );
-				this.timerID = this.asyncDispatch( X.Event.ERROR );
-			} else
-			if( this.timeout < ( this.tick += this.delay ) ){
-				this._busy  = false;
-				this.finish = true;
-				X.Timer.remove( this.timerID );
-				this.timerID = this.asyncDispatch( X.Event.TIMEOUT );
+				this.timerID = X_Timer_add( this.delay, 0, this, X_ImgLoader_detect );
 			};
 		},
 		
 		cancel : function(){
+			var raw = this[ '_rawObject' ];
 			// abort がある?
-			this._rawObject && this._rawObject.abort && this._rawObject.abort();
-			this._busy  = false;
+			raw && raw.abort && raw.abort();
+			// this[ '_rawObject' ].src = '';
 			this.finish = true;
-			this.asyncDispatch( X.Event.CANCELED );
 		},
 		
 		reset : function(){
-			this.timerID && X.Timer.remove( this.timerID );
-			//X_Net_Image_isElement ? this._rawObject.removeAttribute( 'src' ) : ( this._rawObject.src = '' );
-			this._rawObject.src = '';
-			this.timerID  = 0;
-			this._busy    = false;
-			this.finished = false;
-			this.abspath  = '';
+			//console.log( '/ X.Net.Image:reset ' + this.abspath + ' timerID:' + this.timerID );
+			
+			this.timerID && X_Timer_remove( this.timerID );
+			this.timerID = this.tick = 0;
+			
+			this.finish  = false;
+			this.abspath = '';			
+			//X_ImgLoader_isElement ? this[ '_rawObject' ].removeAttribute( 'src' ) : ( this[ '_rawObject' ].src = '' );
+			this[ '_rawObject' ].src = '';
+			
+			//console.log( '\ X.Net.Image:reset ----------- *' );
 		}
-	}
-);
+	};
+
+function X_ImgLoader_detect(){
+	var raw = this[ '_rawObject' ];
+	
+	if( this.finish ) return;
+	
+	if( raw && raw.complete ){
+		this.finish = true;
+		//console.log( 'X.Net.Image:detect ' + raw.width );
+		if( raw.width ) return;
+		X_Timer_remove( this.timerID );
+		//console.log( '* X.Net.Image:ERROR @detect(1) ' + this.abspath );
+		this.timerID = this[ 'asyncDispatch' ]( X_EVENT_ERROR );
+	} else
+	if( this.timeout < ( this.tick += this.delay ) ){
+		this.finish = true;
+		X_Timer_remove( this.timerID );
+		//console.log( '* X.Net.Image:ERROR @detect(2) ' + this.abspath );
+		this.timerID = this[ 'asyncDispatch' ]( { type : X_EVENT_ERROR, 'timeout' : true } );
+	};
+};
+
+function X_ImgLoader_handleEvent( e ){
+	var raw = this[ '_rawObject' ], size;
+	
+	// IE11 reset() 時にここに入ってくる...
+	if( !this.abspath ) return;
+	//console.log( 'X.Net.Image:handleEvent ' + e.type );
+	
+	switch( e.type ){
+		case 'error' :
+			// ie11(10,9 開発モード)で mineType 不正の場合、画像取得に成功してもエラーイベントが起こるのを無視する。
+			if( X_ImgLoader_0forError && raw.width ) return;
+			if( this.finish ) return;
+			this.finish = true;
+			this.timerID && X_Timer_remove( this.timerID );
+			//console.log( '* X.Net.Image:ERROR @handle ' + this.abspath + X.Timer.now() );
+			//console.dir( raw );
+			this.timerID = this[ 'asyncDispatch' ]( this.timeout, X_EVENT_ERROR );
+			break;
+
+		case 'load' :
+		// if( finish === true ) return; // これがあると firefox3.6 で駄目、、、
+		// if( timer ) return; // これがあると safari3.2 で駄目、、、
+			this.finish = true;
+			this.timerID && X_Timer_remove( this.timerID );
+			if( X_UA[ 'Opera' ] && !raw.complete ){
+				this.timerID = this[ 'asyncDispatch' ]( X_EVENT_ERROR );
+				return;
+			};
+
+			//console.log( '* X.Net.Image:LOAD @handle ' + this.abspath + X.Timer.now() );
+			//console.dir( raw );
+			
+			size = X_Util_Image_getActualDimension( !X_ImgLoader_isElement ? this.abspath : this );
+			this.timerID = this[ 'asyncDispatch' ]( {
+				'type' : X_EVENT_SUCCESS,
+				'src'  : this.abspath,
+				'w'    : size[ 0 ],
+				'h'    : size[ 1 ]
+				// TODO feedback net speed
+				// time , this[ '_rawObject' ].fileSize
+			} );
+			break;
+	};
+};
 
-X_NET_ImageWrapper.listen( [ 'load', 'error' /*, 'abort'*/, X.Event.KILL_INSTANCE ] );
 
-// X_Net_Image_isElement && X_NET_ImageWrapper.appendTo( X.X_Node_systemNode );
+// X_ImgLoader_isElement && X_ImgLoader[ 'appendAt' ]( X_Node_systemNode );