X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.6.x%2Fjs%2F07_audio%2F02_XHTMLAudio.js;h=dd71bde4f7db4f14b156d267810e747b932cb234;hb=475df4df9670f042764a99c80d7716e994d28033;hp=341e8d4c8a7eaf4e7ca9f8489926886ff5c90897;hpb=db13457fcd6dcd4a6a55043426d78f898e16db0a;p=pettanr%2FclientJs.git

diff --git a/0.6.x/js/07_audio/02_XHTMLAudio.js b/0.6.x/js/07_audio/02_XHTMLAudio.js
index 341e8d4..dd71bde 100644
--- a/0.6.x/js/07_audio/02_XHTMLAudio.js
+++ b/0.6.x/js/07_audio/02_XHTMLAudio.js
@@ -4,183 +4,185 @@
  * https://code.google.com/p/uupaa-js/source/browse/trunk/0.8/src/Audio/HTML5Audio.js?r=568
  */
 
-var X_Audio_HTML5Audio, X_Audio_HTML5AudioWrapper, X_Audio_rawAudio,
-	X_Audio_HTML5Audio_LIVE_LIST = [],
-	X_Audio_HTML5Audio_POOL_LIST = [];
+var X_Audio_HTMLAudio_playTrigger =
+		6 <= X_UA[ 'iOS' ] ? 'loadeddata' :
+		X_UA[ 'iOS' ] < 5  ? 'stalled' :
+		X_UA[ 'iOS' ]      ? 'suspend' :
+		X_UA[ 'AndroidChromeBrowser' ] ? 'canplaythrough' :
+		// Android 2.3.5(SBM101SH) では stalled は発生しない,,,　ので必ず loadeddata もチェックする
+		X_UA[ 'AndroidBrowser' ] ? 'stalled' :
+		X_UA[ 'OperaMobile' ] || X_UA[ 'OperaTablet' ] ? 'loadeddata' :
+		//X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ? 'canplay' :
+			'loadeddata', //'canplay',
+	X_Audio_HTMLAudioWrapper,
+	X_Audio_constructor = window[ 'Audio' ] || window.HTMLAudioElement,
+	X_Audio_rawAudio,
+	// onended イベント時に再生を継続する場合、audio.play() を呼ぶ必要がある
+	X_Audio_HTMLAudioWrapper_needPlayOnended = !X_UA[ 'AndroidChromeBrowser' ] && X_UA[ 'AndroidBrowser' ],
+	// Opera Mobile 12 android4.4.4 & 2.3.5 は 2回目以降の currentTime へのセットで currentTime が更新されなくなるため、タイマーを使用する
+	X_Audio_HTMLAudioWrapper_currentTimeFix  = !!X_UA[ 'OperaMobile' ] || !!X_UA[ 'OperaTablet' ], // || ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ),
+	// Android1.6+MobileOpera12では無理っぽい、、、
+	X_Audio_HTMLAudioWrapper_badOperaAndroid = X_Audio_HTMLAudioWrapper_currentTimeFix && X_UA[ 'Android' ] < 2,
+
+	// 一方 Desktop の Opera12 は、loadeddata 等では duration が infinity で、再生後の durationchange 時に duration が判明する。
+	// opera12 volume, mute の変更が2度目以降できない
+	// duration 判明後には currentTime によるシークと、現在時間の取得が可能になる。
+	// canplay で play() durationchange で duration が取れたら loadedmetadata->loadeddata -> canplay する
+	// boombox.js に書いてあった currentTime の効かないブラウザってこいつのことみたい、、、
+	// Opera12.17 Win32(XP) portable apps は勝手に再生が始まる、、、その際には timeupdate が発行されない、、、　iframe+image+audio で使わないときは破棄する、とか。
+	// opera11、10.54 WinXP はまとも、、、
+	// X_Audio_Sprite_handleEvent でも使用
+	X_Audio_HTMLAudioWrapper_ieMobile9Fix    = ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ),
+	X_Audio_HTMLAudioWrapper_durationFix     = ( !X_Audio_HTMLAudioWrapper_currentTimeFix && 12 <= X_UA[ 'Opera' ] ) || X_UA[ 'AndroidChromeBrowser' ],
+	
+	X_Audio_HTMLAudioWrapper_shortPlayFix    = X_UA[ 'AndroidBrowser' ] && X_UA[ 'AndroidWebkit' ] <= 534.3, // Android 4.1.1 でも遭遇(ただしm4a, mp3は優秀, oggはシークが乱れる)
 	
+	
+	X_Audio_codecs;
+
+if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
+	//http://himaxoff.blog111.fc2.com/blog-entry-97.html
+	//引数なしで new Audio() とすると、Operaでエラーになるそうなので注意。
+	X_Audio_rawAudio = new X_Audio_constructor( '' );
 
-if( window.HTMLAudioElement ){
-	function getHTML5AudioWrapper( proxy ){
-		var i = X_Audio_HTML5Audio_LIVE_LIST.length;
-		for( ; i; ){
-			if( X_Audio_HTML5Audio_LIVE_LIST[ --i ].proxy === proxy ) return X_Audio_HTML5Audio_LIVE_LIST[ i ];
+	// https://html5experts.jp/miyuki-baba/3766/
+	// Chrome for Android31 で HE-AAC が低速再生されるバグ
+	// TODO Android4 標準ブラウザで ogg のシークが正しくない！
+	if( X_Audio_rawAudio.canPlayType ){
+		X_Audio_codecs = {
+	      'mp3'  : X_Audio_rawAudio.canPlayType('audio/mpeg'),
+	      'opus' : X_Audio_rawAudio.canPlayType('audio/ogg; codecs="opus"'),
+	      'ogg'  : X_Audio_rawAudio.canPlayType('audio/ogg; codecs="vorbis"'),
+	      'wav'  : X_Audio_rawAudio.canPlayType('audio/wav; codecs="1"'),
+	      'aac'  : X_Audio_rawAudio.canPlayType('audio/aac'),
+	      'm4a'  : X_Audio_rawAudio.canPlayType('audio/x-m4a') + X_Audio_rawAudio.canPlayType('audio/m4a') + X_Audio_rawAudio.canPlayType('audio/aac'),
+	      'mp4'  : X_Audio_rawAudio.canPlayType('audio/x-mp4') + X_Audio_rawAudio.canPlayType('audio/mp4') + X_Audio_rawAudio.canPlayType('audio/aac'),
+	      'weba' : X_Audio_rawAudio.canPlayType('audio/webm; codecs="vorbis"')
 		};
-	};
-	
-	X_Audio_HTML5Audio = X_Class_override(
-		new X.EventDispatcher(),
-		{
-			backendName : 'HTML5 Audio',
-		/*
-		 * HTML5 の audio 要素と video 要素でサポートされているメディアフォーマット
-		 * https://developer.mozilla.org/ja/docs/Web/HTML/Supported_media_formats
-		 * 
-		 * 主要ブラウザのHTML5 audioタグで使えるファイル形式の再生対応状況を調べてみた
-		 * http://sothis.blog.so-net.ne.jp/2010-10-27
-		 * ダメ元で仕様に含まれていない SHOUTcast もテストしてみました。
-		 * 
-		 * IE9 の HTML5 Audio について
-		 * http://kentablog.cluscore.com/2011/05/ie9-html5-audio.html
-		 * 1.Audioオブジェクトを作ることができないので、Audioタグを使う
-		 * 2.クロスドメインアクセスには、「clientaccesspolicy.xml」か「crossdomain.xml」が必要
-		 * 3.wav が不可
-		 * 
-		 * IE9でHTML5 autio タグが無効になる
-		 * http://bbs.wankuma.com/index.cgi?mode=al2&namber=64886&KLOG=109
-		 *  IEのバージョン9.0.8112.16421では、Audioオブジェクトのnewも対応してました。
-		 *  createElement等で動的生成すると、よろしくない
-		 * 
-		 * media-can-play-wav-audio.html
-		 * https://github.com/adobe/webkit/blob/master/LayoutTests/media/media-can-play-wav-audio.html
-		 * testExpected("audio.canPlayType('audio/wav; codecs=1')", "probably");
-		 * 
-		 * HTML5 audioタグ ブラウザ間の違い
-		 * http://wiki.bit-hive.com/tomizoo/pg/HTML5%20audio%A5%BF%A5%B0%20%A5%D6%A5%E9%A5%A6%A5%B6%B4%D6%A4%CE%B0%E3%A4%A4
-		 *  - volume, muted iPhone(iOS4-6)、Android(2.3.6)では動作せず。
-		 *  - FireFox3.6, Android 2.3.6については、src変更後、load()を呼び出さないと切り替わらなかった。iPhoneはload()が不要。
-		 */	
-			detect : function( source, ext ){
-				var ok, mineType = 'audio/' + ext;
-				switch( ext ){
-					case 'mp3' :
-						ok = X_UA.IE || X_UA.Chrome || X_UA.Safari; //( X_UA.OS === 'windows' && X_UA.Safari );
-						mineType = 'audio/mpeg';
-						break;
-					case 'ogg' :
-						ok = 15 <= X_UA.Gecko || X_UA.Chrome || X_UA.Opera;
-						break;
-					case 'm4a' :
-						ok = X_UA.IE || X_UA.WebKit;
-						mineType = 'audio/mp4';
-						break;
-					case 'webm' :
-						ok = 2 <= X_UA.Gecko || 10.6 <= X_UA.Opera; // firefox4+(Gecko2+)
-						break;
-					case 'wav' :
-						ok = X_UA.Gecko || X_UA.Opera || X_UA.Safari; //( X_UA.OS === 'windows' && X_UA.Safari );
-						//mineType = 'audio/wav'; // audio/x-wav ?
-						break;
-					default :
-						mineType = '';
+		(function( X_Audio_codecs, k, v ){
+			for( k in X_Audio_codecs ){
+				//if( X_EMPTY_OBJECT[ k ] ) continue;
+				v = X_Audio_codecs[ k ];
+				v = v && !!( v.split( 'no' ).join( '' ) );
+				if( v ){
+					console.log( k + ' ' + X_Audio_codecs[ k ] );
+					X_Audio_codecs[ k ] = true;
+				} else {
+					delete X_Audio_codecs[ k ];
 				};
-				
-				if( !ok && mineType ){
-					if( !X_Audio_rawAudio ) X_Audio_rawAudio = new Audio;
-					ok = X_Audio_rawAudio.canPlayType( mineType );
+			};
+		})( X_Audio_codecs );
+	} else {
+		// iOS3.2.3
+		X_Audio_codecs = {
+	      'mp3'  : X_UA[ 'IE' ] || X_UA[ 'Chrome' ] || ( X_UA[ 'Windows' ] && X_UA[ 'Safari' ]  ),
+	      'ogg'  : 5 <= X_UA[ 'Gecko' ] || X_UA[ 'Chrome' ] || X_UA[ 'Opera' ] ,
+	      'wav'  : X_UA[ 'Gecko' ] || X_UA[ 'Opera' ] || ( X_UA[ 'Windows' ] && X_UA[ 'Safari' ]  ),
+	      'aac'  : X_UA[ 'IE' ] || X_UA[ 'WebKit' ],
+	      'm4a'  : X_UA[ 'IE' ] || X_UA[ 'WebKit' ],
+	      'mp4'  : X_UA[ 'IE' ] || X_UA[ 'WebKit' ],
+	      'weba' : 2 <= X_UA[ 'Gecko' ] || 10.6 <= X_UA[ 'Opera' ] // firefox4+(Gecko2+)
+		};
+		(function( X_Audio_codecs, k ){
+			for( k in X_Audio_codecs ){
+				//if( X_EMPTY_OBJECT[ k ] ) continue;
+				if( X_Audio_codecs[ k ] ){
+					console.log( k + ' ' + X_Audio_codecs[ k ] );
+					X_Audio_codecs[ k ] = true;
+				} else {
+					delete X_Audio_codecs[ k ];
 				};
-				
-				this.asyncDispatch( ok ? 'support' : 'nosupport' );
-				
-				return this;
-			},
-			
-			register : function( proxy, source, option ){
-				X_Audio_HTML5Audio_LIVE_LIST.push( new X_Audio_HTML5AudioWrapper( proxy, source, option ) );
-			},
-			
-			close : function(){
-				return getHTML5AudioWrapper( this ).close();
-			},
-			
-			play : function( position ){
-				return getHTML5AudioWrapper( this ).play( position );
-			},
-			
-			pause : function(){
-				return getHTML5AudioWrapper( this ).pause();
-			},
-			
-			stop : function(){
-				return getHTML5AudioWrapper( this ).stop();
-			},
-			
-			loop : function( v ){
-				return getHTML5AudioWrapper( this ).loop( v );
-			},
-	
-			state : function(){
-				return getHTML5AudioWrapper( this ).state();
-			},
-	
-			volume : function( v ){
-				return getHTML5AudioWrapper( this ).volume( v );
-			},
-	
-			startTime : function( time ){
-				return getHTML5AudioWrapper( this ).startTime( time );
-			},
-	
-			currentTime : function( time ){
-				return getHTML5AudioWrapper( this ).currentTime( time );
-			},
-	
-			isPlaying : function(){
-				return getHTML5AudioWrapper( this ).isPlaying();
-			}
-		}
-	);
-	
-	X_Audio_BACKENDS.push( X_Audio_HTML5Audio );
+			};
+		})( X_Audio_codecs );
+	};
 	
-	X_Audio_HTML5AudioWrapper = X.EventDispatcher.inherits(
+	X_Audio_HTMLAudioWrapper = X_Audio_AbstractAudioBackend[ 'inherits' ](
 		'X.AV.HTML5AudioWrapper',
-		X.Class.POOL_OBJECT,
+		X_Class.POOL_OBJECT,
 		{
+			_playTime        : 0,
+			_closed          : true,
+			_loaded          : false,
+			_beginTime       : 0,
+			_playForDuration : 0,
+			_lastCurrentTime : 0,
+			_src             : '',
 			
-			proxy           : null,
-			
-			_closed         : true,
-			_lastUserAction : '',
-			
-			_loop           : false,
-			_startTime      : 0,
-			_volume         : 0.5,
-			_autoplay       : false,
+			isM4A            : false,
+			shortPlayFix     : 0,
 			
-			Constructor : function( proxy, source, option ){
-				this.proxy   = proxy;
+			'Constructor' : function( target, source, option ){
+				var raw;
+				
+				this.target  = target || this;
 				this._closed = false;
 				
-				if( option.loop )      this._loop      = true;
-				if( option.startTime ) this._startTime = option.startTime;
-				if( option.volume )    this._volume    = option.volume;
+				this.isM4A   = X_URL_getEXT( source ) === 'm4a';
 				
-				this._rawObject = X_Audio_rawAudio || new Audio( source );//X.Node.create( 'audio', { src : source } ).appendToRoot();//( X.X_Node_systemNode );
+				this.setState( option );
+
+				if( option[ 'useVideo' ] ){
+					this[ '_rawObject' ]  = raw = document.createElement( 'video' );
+	                raw.preload           = 'none'; // auto, metadata, none
+	                //raw.autoplay = false, // no-auto
+	                raw.loop              = false;
+	                raw.muted             = false;
+	                raw.crossorigin       = option[ 'crossorigin' ] || ''; //crossorigin: "anonymous", X.URL.isSameDomain() で切り替え
+	                raw.style.cssText     = 'position:absolute;bottom:0;left:-50px;width:100px;height:100px;opacity:0;';
+					raw.controls          = false;
+					raw.WebKitPlaysInline = true;
+					raw.src               = source;
+					//raw.onclick  = "alert('play');this.actualPlay();";
+					document.body.appendChild( raw );
+					//raw.load();
+				} else {
+					this[ '_rawObject' ] = X_Audio_rawAudio || new X_Audio_constructor( source );
+					// X_Doc_create( 'audio', { src : source } )[ 'appendTo' ]( X.Doc.body );
+					this[ '_rawObject' ].autobuffer = false;
+					this._src = source;
+				};
 				
-				this.listen( [
+				this[ 'listen' ]( [
 						'loadstart', 'load', 'progress', 'suspend', 'abort', 'error', 'emptied', 'stalled', 'play', 'pause', 'loadedmetadata',
 						'loadeddata', 'waiting', 'playing', 'canplay', 'canplaythrough', 'seeking', 'seeked', 'timeupdate', 'ended',
 						'ratechange', 'durationchange', 'volumechange' ], this.handleEventProxy );				
-				
-				if( X_Audio_rawAudio ){
-					X_Audio_rawAudio.src = source;
-					X_Audio_rawAudio.load(); // 要る?
+
+				//document.body.appendChild( this[ '_rawObject' ] );
+				this[ '_rawObject' ].autoplay = false;
+
+				if( X_Audio_rawAudio === this[ '_rawObject' ] ){
+					if( X_Audio_HTMLAudioWrapper_badOperaAndroid ){
+						X_Audio_HTMLAudioWrapper_badOperaAndroid && alert( 12 );
+						X_EventDispatcher_toggleAllEvents( this, false );
+						this[ '_rawObject' ] = new X_Audio_constructor( X_URL_toAbsolutePath( source ) );
+						//X_EventDispatcher_toggleAllEvents( this, true );
+					} else {
+						X_Audio_rawAudio.src = source;
+					};
+
+					//this[ '_rawObject' ] = new X_Audio_constructor( X_URL_toAbsolutePath( source ) );
+					/*!X_Audio_Sprite_needTouchFirst && */ X_Audio_rawAudio.load(); // 要る?
 					X_Audio_rawAudio = null;
 				};
 
-				//document.body.appendChild( this._rawObject );
-
-				this._rawObject.volume   = this._volume;
-				this._rawObject.autoplay = false;
-				option.autoplay && X.Timer.once( 100, this, this.play );
-				
-				this.listenOnce( X.Event.KILL_INSTANCE );
+				this[ 'listenOnce' ]( X_EVENT_KILL_INSTANCE );
 			},
 			
 			handleEvent : function( e ){
 				switch( e.type ){
 
-					case X.Event.KILL_INSTANCE :
+					case X_EVENT_KILL_INSTANCE :
+						// 【javascript】モバイル向けブラウザでも音を鳴らしたい【WebAudio】
+						// http://ingaouhou.com/archives/3633
+						// ・使い終わったインスタンスはload()しておくとやや安定
+						this.playing && this.actualPause();
+						delete this._closed;
+						delete this._loaded;
+						
+						this[ '_rawObject' ].src = '';
+						this[ '_rawObject' ].load();
+						
+						// removeChild for video
 						break;
 				};
 			},
@@ -188,136 +190,361 @@ if( window.HTMLAudioElement ){
 			 * http://uguisu.skr.jp/html/table3.html
 			 */
 			handleEventProxy : function( e ){
-				console.log(e.type);
+				var type, loaded, end, now;
+				
+				X_Audio_HTMLAudioWrapper_badOperaAndroid && alert( e.type );
+				
+				// global に公開
+				//window[ '__rawAudio' ] = this[ '_rawObject' ];
+				
+				/* X_Audio_HTMLAudioWrapper_ieMobile9Fix && */ e.type !== 'timeupdate' && console.log( e.type );
 				
 				switch( e.type ){
 					case 'loadstart' :      // 	ブラウザがコンテンツの検索を開始した場合に発生
 						break;
 					case 'progress' :       // 	ブラウザがコンテンツの取得を実行した場合に発生
-						//console.log( e.loaded + ' ' + e.total * 100 + '%' );
-						console.log( this._rawObject.buffered.end(0) / this._rawObject.duration * 100 + '%' );
+						console.log( e.loaded + ' ' + e.total * 100 + '%' );
+						// iem9 で常に0 this[ '_rawObject' ].networkState;
+						// opera Android 12 で　buffered.end() へのアクセスはエラー　try catch も無効、iem9 は常に end(0) = 0
+						//console.log( 'buffered.end ' + this[ '_rawObject' ].buffered && this[ '_rawObject' ].buffered.end(0) ); 
 						break;
+					
+					case 'canplay' :        // 	今すぐに再生を再開できるが、バッファリングが不十分でコンテンツを最後まで表示できないと予測している場合に発生
+						if( X_Audio_HTMLAudioWrapper_durationFix && this._playForDuration === 0 && !X_UA[ 'AndroidChromeBrowser' ] ){
+							console.log( '[duration fix]開始 - ' + this[ '_rawObject' ].duration );
+							this._playForDuration = 1;
+							this[ '_rawObject' ].play();
+							this[ '_rawObject' ].currentTime = this._beginTime / 1000; // 必要！
+							return;
+						};
+					case 'loadedmetadata' : // 	ブラウザがメディアリソースの長さと寸法を判定した場合に発生
+					case 'loadeddata' :     // 	コンテンツの表示を現在の再生位置で初めて行えるようになった場合に発生
+					case 'canplaythrough' : // 	今すぐに再生を開始してもバッファリングで停止することなく最後まで表示できると予測している場合に発生
+						X_Audio_HTMLAudioWrapper_durationFix && console.log( '[duration fix]' + e.type + ' ' + this._playForDuration );
+						if( X_Audio_HTMLAudioWrapper_durationFix && this._playForDuration !== 2 ) return;
+						this.duration = this.duration || this[ '_rawObject' ].duration * 1000;
+						break;
+	
+					case 'stalled' :        // 	ブラウザがコンテンツの取得を試みたが、データがまだ用意されていない場合に発生
+						// Android2 で ready 扱い?
 					case 'suspend' :        // 	ブラウザが意図的にコンテンツの取得を現在行っていない場合に発生（ダウンロードは未完了）
+						// iOS で ready 扱い
+					case 'emptied' :        // 	読み込み中に致命的なエラーが発生したか、実行状態ででload()メソッドが実行された場合に発生
 					case 'abort' :          // 	ダウンロードの完了前にコンテンツの取得を停止した場合に発生（この停止はエラーによるものではない）
+						break;
+						
 					case 'error' :          // 	コンテンツの取得実行中にエラーが発生した場合に発生
-					case 'emptied' :        // 	読み込み中に致命的なエラーが発生したか、実行状態ででload()メソッドが実行された場合に発生
-					case 'stalled' :        // 	ブラウザがコンテンツの取得を試みたが、データがまだ用意されていない場合に発生
+						type = X_EVENT_ERROR;
+						break;
+					
+					case 'playing' :        // 	再生が開始された場合に発生
+						if( X_Audio_HTMLAudioWrapper_currentTimeFix ){
+							this._playTime  = X_Timer_now();
+						};
+						type = X_EVENT_MEDIA_PLAYING;
 					case 'play' :           // 	再生が開始された。play()メソッドからの復帰後に発生する場合に発生
 					case 'pause' :          // 	再生が一時停止された。pauseメソッドからの復帰後に発生する場合に発生
-					case 'loadedmetadata' : // 	ブラウザがメディアリソースの長さと寸法を判定した場合に発生
-					case 'loadeddata' :     // 	コンテンツの表示を現在の再生位置で初めて行えるようになった場合に発生
+					case 'seeked' :         // 	シークがfalseに変化した場合に発生
+					case 'ratechange' :     // defaultPlaybackRate属性とplaybackRate属性のどちらかが更新された場合に発生
+					case 'volumechange' :   // volume属性とmuted属性のどちらかが変化した場合に発生
+						if( this._playForDuration === 1 ) return;
+						break;
+						
 					case 'waiting' :        // 	次のフレームが利用不可のため再生を停止したが、そのフレームがやがて利用可能になると想定している場合に発生
-					case 'playing' :        // 	再生が開始された場合に発生
-					case 'canplay' :        // 	今すぐに再生を再開できるが、バッファリングが不十分でコンテンツを最後まで表示できないと予測している場合に発生
-					case 'canplaythrough' : // 	今すぐに再生を開始してもバッファリングで停止することなく最後まで表示できると予測している場合に発生
+						type = X_EVENT_MEDIA_WAITING;
 					case 'seeking' :        // 	シークがtrueに変化し、イベントを発生させるのに十分な時間がシーク操作にかかっている場合に発生
-					case 'seeked' :         // 	シークがfalseに変化した場合に発生
-					case 'timeupdate' :     // 	通常の再生が行われ現在の再生位置の変化が起こった場合に発生
+						type = type || X_EVENT_MEDIA_SEEKING;
+						if( this._playForDuration === 1 ) return;
 						break;
-					
+						
 					case 'ended' :
-						//!this._closed && this._lastUserAction !== 'stop' && this._loop && this.play();
+						if( !this._closed && this.autoLoop ){
+							if( !( this.target[ 'dispatch' ]( X_EVENT_MEDIA_BEFORE_LOOP ) & X_CALLBACK_PREVENT_DEFAULT ) ){
+								this.looped = true;
+								this.target[ 'dispatch' ]( X_EVENT_MEDIA_LOOPED );
+								this.actualPlay( X_Audio_HTMLAudioWrapper_needPlayOnended );
+							};
+							// Android4.1.1 ended 後に曲の再生が継続できない
+							return;
+						};
+						type = X_EVENT_MEDIA_ENDED;
+						this.seekTime = 0;
+						delete this.playing;
 						break;
 	
-					case 'ratechange' :     // defaultPlaybackRate属性とplaybackRate属性のどちらかが更新された場合に発生
+					// TODO firefox で 短い音声でtimeupdate, ended が発火しない
+					case 'timeupdate' :     // 	通常の再生が行われ現在の再生位置の変化が起こった場合に発生
+						if( X_Audio_HTMLAudioWrapper_ieMobile9Fix ){
+							if( this._playForDuration === 1 ){
+								console.log( 'tu ' + this[ '_rawObject' ].duration );
+								if( !this.duration && X_Type_isFinite( this[ '_rawObject' ].duration ) && 0 < this[ '_rawObject' ].duration ){
+									this.duration = this.duration || this[ '_rawObject' ].duration * 1000;
+									this._playForDuration = 2;
+					                loaded = true;
+					                break;
+								} else {
+									this[ '_rawObject' ].currentTime = this._beginTime / 1000; // 必要！
+									return;
+								};
+							} else
+							if( this[ '_rawObject' ].currentTime === this._lastCurrentTime ){
+								this.target[ 'dispatch' ]( X_EVENT_MEDIA_WAITING );
+								return;
+							};
+							this._lastCurrentTime = this[ '_rawObject' ].currentTime;
+						};
+						this.duration = this.duration || this[ '_rawObject' ].duration * 1000;
+
+			            if( this.playing ){
+			            	end = X_AudioWrapper_getEndTime( this ) + this.shortPlayFix;
+			            	now = this.getActualCurrentTime();
+			            	console.log( now + ' / ' + end );
+			            	if( 0 + end <= 0 + now ){ // 0+ なぜか iem9 で必要,,,
+				            	if( this.autoLoop ){
+				            		if( !( this.target[ 'dispatch' ]( X_EVENT_MEDIA_BEFORE_LOOP ) & X_CALLBACK_PREVENT_DEFAULT ) ){
+				            			this.looped = true;
+				            			this.target[ 'dispatch' ]( X_EVENT_MEDIA_LOOPED );
+				            			this.actualPlay();
+					            	};
+				            	} else {
+				            		this.actualPause();
+				            		this.target[ 'dispatch' ]( X_EVENT_MEDIA_ENDED );
+				            	};
+			            		return;
+			            	};
+			            } else {
+			            	return;
+			            };
+			            type = X_EVENT_MEDIA_PLAYING;
+						break;
+						
 					case 'durationchange' : // duration属性が更新された場合に発生
-					case 'volumechange' :   // volume属性とmuted属性のどちらかが変化した場合に発生
+						
+						if( !X_Audio_HTMLAudioWrapper_durationFix ){
+							this.duration = this[ '_rawObject' ].duration * 1000;
+							console.log( 'duration : ' + this.duration );
+						} else
+						// Desktop Opera では Infinity, IEM9 では NaN, Android標準ブラウザ(Chrome)では 0
+						if( !this.duration && X_Type_isFinite( this[ '_rawObject' ].duration ) && 0 < this[ '_rawObject' ].duration ){
+							
+							//console.log( this[ '_rawObject' ].duration );
+							
+							this.duration = this[ '_rawObject' ].duration * 1000;
+							
+							if( this._playForDuration === 0 ) this._playForDuration = 2;
+							
+							if( this._playForDuration === 1 ){
+								this._playForDuration = 2;
+								
+								console.log( '[duration fix] Loaded ' + this._loaded );
+								
+								if( this._loaded ){
+									this[ '_rawObject' ].currentTime = this._beginTime / 1000;
+									console.log( '[duration fix] 設定 ' + this._beginTime );
+									return;
+								};
+
+				                loaded = true;
+				                console.log( '[duration fix] 完了' + this.duration );
+				                
+				                if( this.autoplay ){
+									this[ '_rawObject' ].currentTime = this._beginTime / 1000;	
+				                } else
+				                if( X_UA[ 'Opera' ] ){
+				                	// Opera12.17 WinXP で勝手に再生される不具合
+				                	// これで一応再生は止まる、、、
+									this[ '_rawObject' ].src = '';
+									//this[ '_rawObject' ].load();			                	
+				                };
+							};
+							
+						};
+						break;
+					
+				};
+				
+				
+				if( !this._loaded && ( loaded || e.type === X_Audio_HTMLAudio_playTrigger || e.type === 'loadeddata' ) ){
+					this.autoplay && X_Timer_once( 16, this, this.play );
+					this._loaded = true;
+					this.target[ 'asyncDispatch' ]( X_EVENT_READY );
+					console.log( '> Audio Loaded!! ' + e.type + ' d:' + ( this.duration | 0 ) );
+					return;
+				};
+				
+				if( !loaded && type ){
+					console.log( '(2) ' + e.type + ' d:' + ( this.duration | 0 ) );
+					this.target[ 'dispatch' ]( type );
+					type === X_EVENT_ERROR && this[ 'kill' ]();
 				};
-				//console.log( 'html5 ' + e.type + ' ' + ( this.proxy._listeners && this.proxy._listeners[ e.type ] && this.proxy._listeners[ e.type ].length ) );
-				//e.type === 'canplaythrough' && console.dir( e );
-				this.proxy.dispatch( e );
-			},
-			
-			close : function(){
-				// pool, proxy を外す
-				//this.kill();
 			},
-			
-			play : function( position ){
+
+			actualPlay : function( forcePlay ){
+				var begin, end;
+				
 				// もし kill 後に autoplayTimer で呼ばれても、_closed==true なので平気
-			    if( this._closed ) return;
-			    this._lastUserAction = 'play';
-			
-			    if( X_UA.Chrome ){ // [CHROME][FIX] volume TODO どの version で 修正される？
-			        // [!] delay
-			        X.Timer.once( 0, this, this._fixForChrome, [ this._rawObject.volume ] );
-			        this._rawObject.volume = 0;
+				if( this._closed ) return;
+				if( !this._loaded && !X_Audio_HTMLAudioWrapper_ieMobile9Fix /* && !X_Audio_Sprite_inTouchAction */ ){
+	            	this.autoplay = true;
+	            	return;
+				};
+				
+				if( X_Audio_HTMLAudioWrapper_ieMobile9Fix && this._playForDuration === 0 ){
+					console.log( 'DurationFix開始 - ' + this[ '_rawObject' ].duration );
+					this._playForDuration = 1;
+				};
+
+				end   = X_AudioWrapper_getEndTime( this );
+				begin = this._beginTime = X_AudioWrapper_getStartTime( this, end, true );
+
+	            if( X_Audio_HTMLAudioWrapper_shortPlayFix && this.isM4A ){
+	            	this.shortPlayFix = ( 1000 < end - begin ) ? 200 : 400;
+	            	if( this.duration < end + this.shortPlayFix ){
+	            		this.shortPlayFix = this.duration - end;
+	            	};
+	            };
+
+				if( !this[ '_rawObject' ].src ){
+					this._beginTime = begin;
+					this[ '_rawObject' ].src = this._src;
+					delete this._playForDuration;
+				};
+
+			    if( !this.playing || forcePlay ){
+				    if( X_UA[ 'Chrome' ] ){ // [CHROME][FIX] volume TODO どの version で 修正される？
+				        // [!] delay
+				        X_Timer_once( 0, this, this._fixForChrome );
+				        this[ '_rawObject' ].volume = 0;
+				    } else {
+				    	this[ '_rawObject' ].volume = X_Audio_HTMLAudioWrapper_ieMobile9Fix ? 1 : this.gain;
+				    };
+			    	this[ '_rawObject' ].play();
+			    	this.playing = true;
+			    } else
+			    if( X_UA[ 'Gecko' ] ){
+			    	// Gecko PC + Android でseek時に再生がしばしば止まる問題の修正
+			    	this[ '_rawObject' ].play();
 			    };
 			    
-			    if( !this._rawObject.paused ){
-			        this.currentTime( this._startTime );
-			    };
-			    this._rawObject.play();
-			},
-			
-			// [CHROME][FIX] volume
-			_fixForChrome : X_UA.Chrome && function( volume ){
-				!this._closed && ( this._rawObject.volume = volume );
+				//http://himaxoff.blog111.fc2.com/blog-entry-97.html
+				//Firefox3.6では一度も play() していない状態で currentTime = 0 を実行するとエラーになる。
+				//また、GoogleChrome7 では currentTime = 0 直後に play() すると、pause()した位置前後の音が混ざることがある。(少なくとも自分の環境では)
+				this[ '_rawObject' ].currentTime = this._lastCurrentTime = begin / 1000 | 0;
+
+			    console.log( '[HTMLAudio] play ' + begin + ' -> ' + end );
+	            
+	            if( X_Audio_HTMLAudioWrapper_currentTimeFix ){
+                	this._beginTime = begin;
+                	this._playTime  = X_Timer_now();
+	            };
+
 			},
+				
+				// [CHROME][FIX] volume
+				_fixForChrome : X_UA[ 'Chrome' ] && function(){
+					!this._closed && ( this[ '_rawObject' ].volume = this.gain );
+				},
 			
-			pause : function(){
-			    if( !this._closed && !this._rawObject.error ){
-			        this._lastUserAction = 'pause';
-			        this._rawObject.pause();  	
-			    };
+			actualPause : function(){
+				if( !this.playing ) return;
+				
+				this.seekTime = this.getActualCurrentTime();
+
+				delete this._playTime;
+
+		        !this[ '_rawObject' ].error && this[ '_rawObject' ].pause();
+		        
+		        if( X_Audio_HTMLAudioWrapper_durationFix && X_UA[ 'Opera' ] ){
+		        	this[ '_rawObject' ].src = '';
+		        	// load();
+		        };
+		        delete this.playing;
 			},
 			
-			stop : function(){
-			    if( !this._closed && !this._rawObject.error ){
-			        this._lastUserAction = 'stop';
-			        this._rawObject.pause();
-			        this.currentTime( this._startTime );
-			    };
+			getActualCurrentTime : function(){
+				return ( X_Audio_HTMLAudioWrapper_currentTimeFix ?
+				    				X_Timer_now() - this._playTime + this._beginTime :
+				    				this[ '_rawObject' ].currentTime * 1000 | 0 );
 			},
-			
-			loop : function( v ){
-			    if( v === undefined ) return this._loop;
-			    this._rawObject.loop = this._loop = v;
+		/*
+		http://www.w3schools.com/tags/av_prop_error.asp
+		1 = MEDIA_ERR_ABORTED - fetching process aborted by user
+	    2 = MEDIA_ERR_NETWORK - error occurred when downloading
+	    3 = MEDIA_ERR_DECODE - error occurred when decoding
+	    4 = MEDIA_ERR_SRC_NOT_SUPPORTED - audio/video not supported
+	    */			
+			getActualError : function(){
+				return this[ '_rawObject' ].error || 0;
 			},
-	
-			state : function(){
-			    var paused = !!this._rawObject.paused,
-			        ended  = !!this._rawObject.ended;
-			
-			    if( this._lastUserAction === 'stop' ){
-			        if( paused ){
-			            paused = false;
-			            ended  = true;
-			        };
-			    };
 			
-			    return {
-			        loop     : this._rawObject.loop,
-			        error    : this._rawObject.error    || 0,   // 0, 1 ~ 4
-			        paused   : paused,
-			        ended    : ended,
-			        source   : this._rawObject.src      || '',
-			        duration : this._rawObject.duration || 0
-			    };
-			},
-	
-			volume : function( v ){
-			    if( v === undefined ) return this.audio.volume;
-			    this._rawObject.volume = v;
-			},
-	
-			startTime : function( time ){
-			    if( time === undefined ) return this._startTime;
-			    this._startTime = time;
-			},
-	
-			currentTime : function( time ){
-			    if( time === undefined ) return this._rawObject.currentTime;
-			    this._rawObject.currentTime = time;
-			},
-	
-			isPlaying : function(){
-			    return !this._rawObject.error && !this._rawObject.paused && !this._rawObject.ended;
+			afterUpdateState : function( result ){
+				if( result & 3 ){ // seek
+	            	this.actualPlay();
+				} else
+				if( result & 4 ){
+	               this[ '_rawObject' ].volume = X_Audio_HTMLAudioWrapper_ieMobile9Fix ? 1 : this.gain;
+				};				
 			}
 	
 		}
 	);
 	
+	X_Audio_BACKENDS.push(
+		{
+			backendName : 'HTML Audio',
+			
+			canPlay : X_Audio_codecs,
+		/*
+		 * HTML5 の audio 要素と video 要素でサポートされているメディアフォーマット
+		 * https://developer.mozilla.org/ja/docs/Web/HTML/Supported_media_formats
+		 * 
+		 * 主要ブラウザのHTML5 audioタグで使えるファイル形式の再生対応状況を調べてみた
+		 * http://sothis.blog.so-net.ne.jp/2010-10-27
+		 * ダメ元で仕様に含まれていない SHOUTcast もテストしてみました。
+		 * 
+		 * IE9 の HTML5 Audio について
+		 * http://kentablog.cluscore.com/2011/05/ie9-html5-audio.html
+		 * 1.Audioオブジェクトを作ることができないので、Audioタグを使う
+		 * 2.クロスドメインアクセスには、「clientaccesspolicy.xml」か「crossdomain.xml」が必要
+		 * 3.wav が不可
+		 * 
+		 * IE9でHTML5 autio タグが無効になる
+		 * http://bbs.wankuma.com/index.cgi?mode=al2&namber=64886&KLOG=109
+		 *  IEのバージョン9.0.8112.16421では、Audioオブジェクトのnewも対応してました。
+		 *  createElement等で動的生成すると、よろしくない
+		 * 
+		 * media-can-play-wav-audio.html
+		 * https://github.com/adobe/webkit/blob/master/LayoutTests/media/media-can-play-wav-audio.html
+		 * testExpected("audio.canPlayType('audio/wav; codecs=1')", "probably");
+		 * 
+		 * HTML5 audioタグ ブラウザ間の違い
+		 * http://wiki.bit-hive.com/tomizoo/pg/HTML5%20audio%A5%BF%A5%B0%20%A5%D6%A5%E9%A5%A6%A5%B6%B4%D6%A4%CE%B0%E3%A4%A4
+		 *  - volume, muted iPhone(iOS4-6)、Android(2.3.6)では動作せず。
+		 *  - FireFox3.6, Android 2.3.6については、src変更後、load()を呼び出さないと切り替わらなかった。iPhoneはload()が不要。
+		 */	
+			detect : function( proxy, source, ext ){
+				proxy[ 'asyncDispatch' ]( { type : X_EVENT_COMPLETE, canPlay : X_Audio_codecs[ ext ] } );
+			},
+			
+			klass : X_Audio_HTMLAudioWrapper
+			
+		} );
+
+/*
+ * 
+ * howler.js
+ *     codecs = {
+      mp3: !!audioTest.canPlayType('audio/mpeg;').replace(/^no$/, ''),
+      opus: !!audioTest.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/, ''),
+      ogg: !!audioTest.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ''),
+      wav: !!audioTest.canPlayType('audio/wav; codecs="1"').replace(/^no$/, ''),
+      aac: !!audioTest.canPlayType('audio/aac;').replace(/^no$/, ''),
+      m4a: !!(audioTest.canPlayType('audio/x-m4a;') || audioTest.canPlayType('audio/m4a;') || audioTest.canPlayType('audio/aac;')).replace(/^no$/, ''),
+      mp4: !!(audioTest.canPlayType('audio/x-mp4;') || audioTest.canPlayType('audio/mp4;') || audioTest.canPlayType('audio/aac;')).replace(/^no$/, ''),
+      weba: !!audioTest.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, '')
+    };
+ */
+	
 };