0.6.x/js/07_audio/02_XHTMLAudio.js

   1 \r
   2 /*\r
   3  * original : uupaa-js HTML5Audio.js\r
   4  * https://code.google.com/p/uupaa-js/source/browse/trunk/0.8/src/Audio/HTML5Audio.js?r=568\r
   5  */\r
   6 \r
   7 var X_Audio_HTMLAudio_playTrigger =\r
   8                 6 <= X_UA[ 'iOS' ] ? 'loadeddata' :\r
   9                 X_UA[ 'iOS' ] < 5  ? 'stalled' :\r
  10                 X_UA[ 'iOS' ]      ? 'suspend' :\r
  11                 X_UA[ 'AndroidChromeBrowser' ] ? 'canplaythrough' :\r
  12                 // Android 2.3.5(SBM101SH) では stalled は発生しない,,,　ので必ず loadeddata もチェックする\r
  13                 X_UA[ 'AndroidBrowser' ] ? 'stalled' :\r
  14                 X_UA[ 'OperaMobile' ] || X_UA[ 'OperaTablet' ] ? 'loadeddata' :\r
  15                 //X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ? 'canplay' :\r
  16                         'loadeddata', //'canplay',\r
  17         X_Audio_HTMLAudioWrapper,\r
  18         X_Audio_constructor = window[ 'Audio' ] || window.HTMLAudioElement,\r
  19         X_Audio_rawAudio,\r
  20         // onended イベント時に再生を継続する場合、audio.play() を呼ぶ必要がある\r
  21         X_Audio_HTMLAudioWrapper_needPlayOnended = !X_UA[ 'AndroidChromeBrowser' ] && X_UA[ 'AndroidBrowser' ],\r
  22         // Opera Mobile 12 android4.4.4 & 2.3.5 は 2回目以降の currentTime へのセットで currentTime が更新されなくなるため、タイマーを使用する\r
  23         X_Audio_HTMLAudioWrapper_currentTimeFix  = !!X_UA[ 'OperaMobile' ] || !!X_UA[ 'OperaTablet' ], // || ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ),\r
  24         // Android1.6+MobileOpera12では無理っぽい、、、\r
  25         X_Audio_HTMLAudioWrapper_badOperaAndroid = X_Audio_HTMLAudioWrapper_currentTimeFix && X_UA[ 'Android' ] < 2,\r
  26 \r
  27         // 一方 Desktop の Opera12 は、loadeddata 等では duration が infinity で、再生後の durationchange 時に duration が判明する。\r
  28         // opera12 volume, mute の変更が2度目以降できない\r
  29         // duration 判明後には currentTime によるシークと、現在時間の取得が可能になる。\r
  30         // canplay で play() durationchange で duration が取れたら loadedmetadata->loadeddata -> canplay する\r
  31         // boombox.js に書いてあった currentTime の効かないブラウザってこいつのことみたい、、、\r
  32         // Opera12.17 Win32(XP) portable apps は勝手に再生が始まる、、、その際には timeupdate が発行されない、、、　iframe+image+audio で使わないときは破棄する、とか。\r
  33         // opera11、10.54 WinXP はまとも、、、\r
  34         // X_Audio_Sprite_handleEvent でも使用\r
  35         X_Audio_HTMLAudioWrapper_ieMobile9Fix    = ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ),\r
  36         X_Audio_HTMLAudioWrapper_durationFix     = ( !X_Audio_HTMLAudioWrapper_currentTimeFix && 12 <= X_UA[ 'Opera' ] ) || X_UA[ 'AndroidChromeBrowser' ],\r
  37         \r
  38         X_Audio_HTMLAudioWrapper_shortPlayFix    = X_UA[ 'AndroidBrowser' ] && X_UA[ 'AndroidWebkit' ] <= 534.3, // Android 4.1.1 でも遭遇(ただしm4a, mp3は優秀, oggはシークが乱れる)\r
  39         \r
  40         \r
  41         X_Audio_codecs;\r
  42 \r
  43 if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){\r
  44         //http://himaxoff.blog111.fc2.com/blog-entry-97.html\r
  45         //引数なしで new Audio() とすると、Operaでエラーになるそうなので注意。\r
  46         X_Audio_rawAudio = new X_Audio_constructor( '' );\r
  47 \r
  48         // https://html5experts.jp/miyuki-baba/3766/\r
  49         // Chrome for Android31 で HE-AAC が低速再生されるバグ\r
  50         // TODO Android4 標準ブラウザで ogg のシークが正しくない！\r
  51         if( X_Audio_rawAudio.canPlayType ){\r
  52                 X_Audio_codecs = {\r
  53               'mp3'  : X_Audio_rawAudio.canPlayType('audio/mpeg'),\r
  54               'opus' : X_Audio_rawAudio.canPlayType('audio/ogg; codecs="opus"'),\r
  55               'ogg'  : X_Audio_rawAudio.canPlayType('audio/ogg; codecs="vorbis"'),\r
  56               'wav'  : X_Audio_rawAudio.canPlayType('audio/wav; codecs="1"'),\r
  57               'aac'  : X_Audio_rawAudio.canPlayType('audio/aac'),\r
  58               'm4a'  : X_Audio_rawAudio.canPlayType('audio/x-m4a') + X_Audio_rawAudio.canPlayType('audio/m4a') + X_Audio_rawAudio.canPlayType('audio/aac'),\r
  59               'mp4'  : X_Audio_rawAudio.canPlayType('audio/x-mp4') + X_Audio_rawAudio.canPlayType('audio/mp4') + X_Audio_rawAudio.canPlayType('audio/aac'),\r
  60               'weba' : X_Audio_rawAudio.canPlayType('audio/webm; codecs="vorbis"')\r
  61                 };\r
  62                 (function( X_Audio_codecs, k, v ){\r
  63                         for( k in X_Audio_codecs ){\r
  64                                 //if( X_EMPTY_OBJECT[ k ] ) continue;\r
  65                                 v = X_Audio_codecs[ k ];\r
  66                                 v = v && !!( v.split( 'no' ).join( '' ) );\r
  67                                 if( v ){\r
  68                                         console.log( k + ' ' + X_Audio_codecs[ k ] );\r
  69                                         X_Audio_codecs[ k ] = true;\r
  70                                 } else {\r
  71                                         delete X_Audio_codecs[ k ];\r
  72                                 };\r
  73                         };\r
  74                 })( X_Audio_codecs );\r
  75         } else {\r
  76                 // iOS3.2.3\r
  77                 X_Audio_codecs = {\r
  78               'mp3'  : X_UA[ 'IE' ] || X_UA[ 'Chrome' ] || ( X_UA[ 'Windows' ] && X_UA[ 'Safari' ]  ),\r
  79               'ogg'  : 5 <= X_UA[ 'Gecko' ] || X_UA[ 'Chrome' ] || X_UA[ 'Opera' ] ,\r
  80               'wav'  : X_UA[ 'Gecko' ] || X_UA[ 'Opera' ] || ( X_UA[ 'Windows' ] && X_UA[ 'Safari' ]  ),\r
  81               'aac'  : X_UA[ 'IE' ] || X_UA[ 'WebKit' ],\r
  82               'm4a'  : X_UA[ 'IE' ] || X_UA[ 'WebKit' ],\r
  83               'mp4'  : X_UA[ 'IE' ] || X_UA[ 'WebKit' ],\r
  84               'weba' : 2 <= X_UA[ 'Gecko' ] || 10.6 <= X_UA[ 'Opera' ] // firefox4+(Gecko2+)\r
  85                 };\r
  86                 (function( X_Audio_codecs, k ){\r
  87                         for( k in X_Audio_codecs ){\r
  88                                 //if( X_EMPTY_OBJECT[ k ] ) continue;\r
  89                                 if( X_Audio_codecs[ k ] ){\r
  90                                         console.log( k + ' ' + X_Audio_codecs[ k ] );\r
  91                                         X_Audio_codecs[ k ] = true;\r
  92                                 } else {\r
  93                                         delete X_Audio_codecs[ k ];\r
  94                                 };\r
  95                         };\r
  96                 })( X_Audio_codecs );\r
  97         };\r
  98         \r
  99         X_Audio_HTMLAudioWrapper = X_Audio_AbstractAudioBackend[ 'inherits' ](\r
 100                 'X.AV.HTML5AudioWrapper',\r
 101                 X_Class.POOL_OBJECT,\r
 102                 {\r
 103                         _playTime        : 0,\r
 104                         _closed          : true,\r
 105                         _loaded          : false,\r
 106                         _beginTime       : 0,\r
 107                         _playForDuration : 0,\r
 108                         _lastCurrentTime : 0,\r
 109                         _src             : '',\r
 110                         \r
 111                         isM4A            : false,\r
 112                         shortPlayFix     : 0,\r
 113                         \r
 114                         'Constructor' : function( target, source, option ){\r
 115                                 var raw;\r
 116                                 \r
 117                                 this.target  = target || this;\r
 118                                 this._closed = false;\r
 119                                 \r
 120                                 this.isM4A   = X_URL_getEXT( source ) === 'm4a';\r
 121                                 \r
 122                                 this.setState( option );\r
 123 \r
 124                                 if( option[ 'useVideo' ] ){\r
 125                                         this[ '_rawObject' ]  = raw = document.createElement( 'video' );\r
 126                         raw.preload           = 'none'; // auto, metadata, none\r
 127                         //raw.autoplay = false, // no-auto\r
 128                         raw.loop              = false;\r
 129                         raw.muted             = false;\r
 130                         raw.crossorigin       = option[ 'crossorigin' ] || ''; //crossorigin: "anonymous", X.URL.isSameDomain() で切り替え\r
 131                         raw.style.cssText     = 'position:absolute;bottom:0;left:-50px;width:100px;height:100px;opacity:0;';\r
 132                                         raw.controls          = false;\r
 133                                         raw.WebKitPlaysInline = true;\r
 134                                         raw.src               = source;\r
 135                                         //raw.onclick  = "alert('play');this.actualPlay();";\r
 136                                         document.body.appendChild( raw );\r
 137                                         //raw.load();\r
 138                                 } else {\r
 139                                         this[ '_rawObject' ] = X_Audio_rawAudio || new X_Audio_constructor( source );\r
 140                                         // X_Doc_create( 'audio', { src : source } )[ 'appendTo' ]( X.Doc.body );\r
 141                                         this[ '_rawObject' ].autobuffer = false;\r
 142                                         this._src = source;\r
 143                                 };\r
 144                                 \r
 145                                 this[ 'listen' ]( [\r
 146                                                 'loadstart', 'load', 'progress', 'suspend', 'abort', 'error', 'emptied', 'stalled', 'play', 'pause', 'loadedmetadata',\r
 147                                                 'loadeddata', 'waiting', 'playing', 'canplay', 'canplaythrough', 'seeking', 'seeked', 'timeupdate', 'ended',\r
 148                                                 'ratechange', 'durationchange', 'volumechange' ], this.handleEventProxy );                              \r
 149 \r
 150                                 //document.body.appendChild( this[ '_rawObject' ] );\r
 151                                 this[ '_rawObject' ].autoplay = false;\r
 152 \r
 153                                 if( X_Audio_rawAudio === this[ '_rawObject' ] ){\r
 154                                         if( X_Audio_HTMLAudioWrapper_badOperaAndroid ){\r
 155                                                 X_Audio_HTMLAudioWrapper_badOperaAndroid && alert( 12 );\r
 156                                                 X_EventDispatcher_toggleAllEvents( this, false );\r
 157                                                 this[ '_rawObject' ] = new X_Audio_constructor( X_URL_toAbsolutePath( source ) );\r
 158                                                 //X_EventDispatcher_toggleAllEvents( this, true );\r
 159                                         } else {\r
 160                                                 X_Audio_rawAudio.src = source;\r
 161                                         };\r
 162 \r
 163                                         //this[ '_rawObject' ] = new X_Audio_constructor( X_URL_toAbsolutePath( source ) );\r
 164                                         /*!X_Audio_Sprite_needTouchFirst && */ X_Audio_rawAudio.load(); // 要る?\r
 165                                         X_Audio_rawAudio = null;\r
 166                                 };\r
 167 \r
 168                                 this[ 'listenOnce' ]( X_EVENT_KILL_INSTANCE );\r
 169                         },\r
 170                         \r
 171                         handleEvent : function( e ){\r
 172                                 switch( e.type ){\r
 173 \r
 174                                         case X_EVENT_KILL_INSTANCE :\r
 175                                                 // 【javascript】モバイル向けブラウザでも音を鳴らしたい【WebAudio】\r
 176                                                 // http://ingaouhou.com/archives/3633\r
 177                                                 // ・使い終わったインスタンスはload()しておくとやや安定\r
 178                                                 this.playing && this.actualPause();\r
 179                                                 delete this._closed;\r
 180                                                 delete this._loaded;\r
 181                                                 \r
 182                                                 this[ '_rawObject' ].src = '';\r
 183                                                 this[ '_rawObject' ].load();\r
 184                                                 \r
 185                                                 // removeChild for video\r
 186                                                 break;\r
 187                                 };\r
 188                         },\r
 189                         /*\r
 190                          * http://uguisu.skr.jp/html/table3.html\r
 191                          */\r
 192                         handleEventProxy : function( e ){\r
 193                                 var type, loaded, end, now;\r
 194                                 \r
 195                                 X_Audio_HTMLAudioWrapper_badOperaAndroid && alert( e.type );\r
 196                                 \r
 197                                 // global に公開\r
 198                                 //window[ '__rawAudio' ] = this[ '_rawObject' ];\r
 199                                 \r
 200                                 /* X_Audio_HTMLAudioWrapper_ieMobile9Fix && */ e.type !== 'timeupdate' && console.log( e.type );\r
 201                                 \r
 202                                 switch( e.type ){\r
 203                                         case 'loadstart' :      //      ブラウザがコンテンツの検索を開始した場合に発生\r
 204                                                 break;\r
 205                                         case 'progress' :       //      ブラウザがコンテンツの取得を実行した場合に発生\r
 206                                                 console.log( e.loaded + ' ' + e.total * 100 + '%' );\r
 207                                                 // iem9 で常に0 this[ '_rawObject' ].networkState;\r
 208                                                 // opera Android 12 で　buffered.end() へのアクセスはエラー　try catch も無効、iem9 は常に end(0) = 0\r
 209                                                 //console.log( 'buffered.end ' + this[ '_rawObject' ].buffered && this[ '_rawObject' ].buffered.end(0) ); \r
 210                                                 break;\r
 211                                         \r
 212                                         case 'canplay' :        //      今すぐに再生を再開できるが、バッファリングが不十分でコンテンツを最後まで表示できないと予測している場合に発生\r
 213                                                 if( X_Audio_HTMLAudioWrapper_durationFix && this._playForDuration === 0 && !X_UA[ 'AndroidChromeBrowser' ] ){\r
 214                                                         console.log( '[duration fix]開始 - ' + this[ '_rawObject' ].duration );\r
 215                                                         this._playForDuration = 1;\r
 216                                                         this[ '_rawObject' ].play();\r
 217                                                         this[ '_rawObject' ].currentTime = this._beginTime / 1000; // 必要！\r
 218                                                         return;\r
 219                                                 };\r
 220                                         case 'loadedmetadata' : //      ブラウザがメディアリソースの長さと寸法を判定した場合に発生\r
 221                                         case 'loadeddata' :     //      コンテンツの表示を現在の再生位置で初めて行えるようになった場合に発生\r
 222                                         case 'canplaythrough' : //      今すぐに再生を開始してもバッファリングで停止することなく最後まで表示できると予測している場合に発生\r
 223                                                 X_Audio_HTMLAudioWrapper_durationFix && console.log( '[duration fix]' + e.type + ' ' + this._playForDuration );\r
 224                                                 if( X_Audio_HTMLAudioWrapper_durationFix && this._playForDuration !== 2 ) return;\r
 225                                                 this.duration = this.duration || this[ '_rawObject' ].duration * 1000;\r
 226                                                 break;\r
 227         \r
 228                                         case 'stalled' :        //      ブラウザがコンテンツの取得を試みたが、データがまだ用意されていない場合に発生\r
 229                                                 // Android2 で ready 扱い?\r
 230                                         case 'suspend' :        //      ブラウザが意図的にコンテンツの取得を現在行っていない場合に発生（ダウンロードは未完了）\r
 231                                                 // iOS で ready 扱い\r
 232                                         case 'emptied' :        //      読み込み中に致命的なエラーが発生したか、実行状態ででload()メソッドが実行された場合に発生\r
 233                                         case 'abort' :          //      ダウンロードの完了前にコンテンツの取得を停止した場合に発生（この停止はエラーによるものではない）\r
 234                                                 break;\r
 235                                                 \r
 236                                         case 'error' :          //      コンテンツの取得実行中にエラーが発生した場合に発生\r
 237                                                 type = X_EVENT_ERROR;\r
 238                                                 break;\r
 239                                         \r
 240                                         case 'playing' :        //      再生が開始された場合に発生\r
 241                                                 if( X_Audio_HTMLAudioWrapper_currentTimeFix ){\r
 242                                                         this._playTime  = X_Timer_now();\r
 243                                                 };\r
 244                                                 type = X_EVENT_MEDIA_PLAYING;\r
 245                                         case 'play' :           //      再生が開始された。play()メソッドからの復帰後に発生する場合に発生\r
 246                                         case 'pause' :          //      再生が一時停止された。pauseメソッドからの復帰後に発生する場合に発生\r
 247                                         case 'seeked' :         //      シークがfalseに変化した場合に発生\r
 248                                         case 'ratechange' :     // defaultPlaybackRate属性とplaybackRate属性のどちらかが更新された場合に発生\r
 249                                         case 'volumechange' :   // volume属性とmuted属性のどちらかが変化した場合に発生\r
 250                                                 if( this._playForDuration === 1 ) return;\r
 251                                                 break;\r
 252                                                 \r
 253                                         case 'waiting' :        //      次のフレームが利用不可のため再生を停止したが、そのフレームがやがて利用可能になると想定している場合に発生\r
 254                                                 type = X_EVENT_MEDIA_WAITING;\r
 255                                         case 'seeking' :        //      シークがtrueに変化し、イベントを発生させるのに十分な時間がシーク操作にかかっている場合に発生\r
 256                                                 type = type || X_EVENT_MEDIA_SEEKING;\r
 257                                                 if( this._playForDuration === 1 ) return;\r
 258                                                 break;\r
 259                                                 \r
 260                                         case 'ended' :\r
 261                                                 if( !this._closed && this.autoLoop ){\r
 262                                                         if( !( this.target[ 'dispatch' ]( X_EVENT_MEDIA_BEFORE_LOOP ) & X_CALLBACK_PREVENT_DEFAULT ) ){\r
 263                                                                 this.looped = true;\r
 264                                                                 this.target[ 'dispatch' ]( X_EVENT_MEDIA_LOOPED );\r
 265                                                                 this.actualPlay( X_Audio_HTMLAudioWrapper_needPlayOnended );\r
 266                                                         };\r
 267                                                         // Android4.1.1 ended 後に曲の再生が継続できない\r
 268                                                         return;\r
 269                                                 };\r
 270                                                 type = X_EVENT_MEDIA_ENDED;\r
 271                                                 this.seekTime = 0;\r
 272                                                 delete this.playing;\r
 273                                                 break;\r
 274         \r
 275                                         // TODO firefox で 短い音声でtimeupdate, ended が発火しない\r
 276                                         case 'timeupdate' :     //      通常の再生が行われ現在の再生位置の変化が起こった場合に発生\r
 277                                                 if( X_Audio_HTMLAudioWrapper_ieMobile9Fix ){\r
 278                                                         if( this._playForDuration === 1 ){\r
 279                                                                 console.log( 'tu ' + this[ '_rawObject' ].duration );\r
 280                                                                 if( !this.duration && X_Type_isFinite( this[ '_rawObject' ].duration ) && 0 < this[ '_rawObject' ].duration ){\r
 281                                                                         this.duration = this.duration || this[ '_rawObject' ].duration * 1000;\r
 282                                                                         this._playForDuration = 2;\r
 283                                                         loaded = true;\r
 284                                                         break;\r
 285                                                                 } else {\r
 286                                                                         this[ '_rawObject' ].currentTime = this._beginTime / 1000; // 必要！\r
 287                                                                         return;\r
 288                                                                 };\r
 289                                                         } else\r
 290                                                         if( this[ '_rawObject' ].currentTime === this._lastCurrentTime ){\r
 291                                                                 this.target[ 'dispatch' ]( X_EVENT_MEDIA_WAITING );\r
 292                                                                 return;\r
 293                                                         };\r
 294                                                         this._lastCurrentTime = this[ '_rawObject' ].currentTime;\r
 295                                                 };\r
 296                                                 this.duration = this.duration || this[ '_rawObject' ].duration * 1000;\r
 297 \r
 298                                     if( this.playing ){\r
 299                                         end = X_AudioWrapper_getEndTime( this ) + this.shortPlayFix;\r
 300                                         now = this.getActualCurrentTime();\r
 301                                         console.log( now + ' / ' + end );\r
 302                                         if( 0 + end <= 0 + now ){ // 0+ なぜか iem9 で必要,,,\r
 303                                                 if( this.autoLoop ){\r
 304                                                         if( !( this.target[ 'dispatch' ]( X_EVENT_MEDIA_BEFORE_LOOP ) & X_CALLBACK_PREVENT_DEFAULT ) ){\r
 305                                                                 this.looped = true;\r
 306                                                                 this.target[ 'dispatch' ]( X_EVENT_MEDIA_LOOPED );\r
 307                                                                 this.actualPlay();\r
 308                                                         };\r
 309                                                 } else {\r
 310                                                         this.actualPause();\r
 311                                                         this.target[ 'dispatch' ]( X_EVENT_MEDIA_ENDED );\r
 312                                                 };\r
 313                                                 return;\r
 314                                         };\r
 315                                     } else {\r
 316                                         return;\r
 317                                     };\r
 318                                     type = X_EVENT_MEDIA_PLAYING;\r
 319                                                 break;\r
 320                                                 \r
 321                                         case 'durationchange' : // duration属性が更新された場合に発生\r
 322                                                 \r
 323                                                 if( !X_Audio_HTMLAudioWrapper_durationFix ){\r
 324                                                         this.duration = this[ '_rawObject' ].duration * 1000;\r
 325                                                         console.log( 'duration : ' + this.duration );\r
 326                                                 } else\r
 327                                                 // Desktop Opera では Infinity, IEM9 では NaN, Android標準ブラウザ(Chrome)では 0\r
 328                                                 if( !this.duration && X_Type_isFinite( this[ '_rawObject' ].duration ) && 0 < this[ '_rawObject' ].duration ){\r
 329                                                         \r
 330                                                         //console.log( this[ '_rawObject' ].duration );\r
 331                                                         \r
 332                                                         this.duration = this[ '_rawObject' ].duration * 1000;\r
 333                                                         \r
 334                                                         if( this._playForDuration === 0 ) this._playForDuration = 2;\r
 335                                                         \r
 336                                                         if( this._playForDuration === 1 ){\r
 337                                                                 this._playForDuration = 2;\r
 338                                                                 \r
 339                                                                 console.log( '[duration fix] Loaded ' + this._loaded );\r
 340                                                                 \r
 341                                                                 if( this._loaded ){\r
 342                                                                         this[ '_rawObject' ].currentTime = this._beginTime / 1000;\r
 343                                                                         console.log( '[duration fix] 設定 ' + this._beginTime );\r
 344                                                                         return;\r
 345                                                                 };\r
 346 \r
 347                                                 loaded = true;\r
 348                                                 console.log( '[duration fix] 完了' + this.duration );\r
 349                                                 \r
 350                                                 if( this.autoplay ){\r
 351                                                                         this[ '_rawObject' ].currentTime = this._beginTime / 1000;      \r
 352                                                 } else\r
 353                                                 if( X_UA[ 'Opera' ] ){\r
 354                                                         // Opera12.17 WinXP で勝手に再生される不具合\r
 355                                                         // これで一応再生は止まる、、、\r
 356                                                                         this[ '_rawObject' ].src = '';\r
 357                                                                         //this[ '_rawObject' ].load();                                          \r
 358                                                 };\r
 359                                                         };\r
 360                                                         \r
 361                                                 };\r
 362                                                 break;\r
 363                                         \r
 364                                 };\r
 365                                 \r
 366                                 \r
 367                                 if( !this._loaded && ( loaded || e.type === X_Audio_HTMLAudio_playTrigger || e.type === 'loadeddata' ) ){\r
 368                                         this.autoplay && X_Timer_once( 16, this, this.play );\r
 369                                         this._loaded = true;\r
 370                                         this.target[ 'asyncDispatch' ]( X_EVENT_READY );\r
 371                                         console.log( '> Audio Loaded!! ' + e.type + ' d:' + ( this.duration | 0 ) );\r
 372                                         return;\r
 373                                 };\r
 374                                 \r
 375                                 if( !loaded && type ){\r
 376                                         console.log( '(2) ' + e.type + ' d:' + ( this.duration | 0 ) );\r
 377                                         this.target[ 'dispatch' ]( type );\r
 378                                         type === X_EVENT_ERROR && this[ 'kill' ]();\r
 379                                 };\r
 380                         },\r
 381 \r
 382                         actualPlay : function( forcePlay ){\r
 383                                 var begin, end;\r
 384                                 \r
 385                                 // もし kill 後に autoplayTimer で呼ばれても、_closed==true なので平気\r
 386                                 if( this._closed ) return;\r
 387                                 if( !this._loaded && !X_Audio_HTMLAudioWrapper_ieMobile9Fix /* && !X_Audio_Sprite_inTouchAction */ ){\r
 388                         this.autoplay = true;\r
 389                         return;\r
 390                                 };\r
 391                                 \r
 392                                 if( X_Audio_HTMLAudioWrapper_ieMobile9Fix && this._playForDuration === 0 ){\r
 393                                         console.log( 'DurationFix開始 - ' + this[ '_rawObject' ].duration );\r
 394                                         this._playForDuration = 1;\r
 395                                 };\r
 396 \r
 397                                 end   = X_AudioWrapper_getEndTime( this );\r
 398                                 begin = this._beginTime = X_AudioWrapper_getStartTime( this, end, true );\r
 399 \r
 400                     if( X_Audio_HTMLAudioWrapper_shortPlayFix && this.isM4A ){\r
 401                         this.shortPlayFix = ( 1000 < end - begin ) ? 200 : 400;\r
 402                         if( this.duration < end + this.shortPlayFix ){\r
 403                                 this.shortPlayFix = this.duration - end;\r
 404                         };\r
 405                     };\r
 406 \r
 407                                 if( !this[ '_rawObject' ].src ){\r
 408                                         this._beginTime = begin;\r
 409                                         this[ '_rawObject' ].src = this._src;\r
 410                                         delete this._playForDuration;\r
 411                                 };\r
 412 \r
 413                             if( !this.playing || forcePlay ){\r
 414                                     if( X_UA[ 'Chrome' ] ){ // [CHROME][FIX] volume TODO どの version で 修正される？\r
 415                                         // [!] delay\r
 416                                         X_Timer_once( 0, this, this._fixForChrome );\r
 417                                         this[ '_rawObject' ].volume = 0;\r
 418                                     } else {\r
 419                                         this[ '_rawObject' ].volume = X_Audio_HTMLAudioWrapper_ieMobile9Fix ? 1 : this.gain;\r
 420                                     };\r
 421                                 this[ '_rawObject' ].play();\r
 422                                 this.playing = true;\r
 423                             } else\r
 424                             if( X_UA[ 'Gecko' ] ){\r
 425                                 // Gecko PC + Android でseek時に再生がしばしば止まる問題の修正\r
 426                                 this[ '_rawObject' ].play();\r
 427                             };\r
 428                             \r
 429                                 //http://himaxoff.blog111.fc2.com/blog-entry-97.html\r
 430                                 //Firefox3.6では一度も play() していない状態で currentTime = 0 を実行するとエラーになる。\r
 431                                 //また、GoogleChrome7 では currentTime = 0 直後に play() すると、pause()した位置前後の音が混ざることがある。(少なくとも自分の環境では)\r
 432                                 this[ '_rawObject' ].currentTime = this._lastCurrentTime = begin / 1000 | 0;\r
 433 \r
 434                             console.log( '[HTMLAudio] play ' + begin + ' -> ' + end );\r
 435                     \r
 436                     if( X_Audio_HTMLAudioWrapper_currentTimeFix ){\r
 437                         this._beginTime = begin;\r
 438                         this._playTime  = X_Timer_now();\r
 439                     };\r
 440 \r
 441                         },\r
 442                                 \r
 443                                 // [CHROME][FIX] volume\r
 444                                 _fixForChrome : X_UA[ 'Chrome' ] && function(){\r
 445                                         !this._closed && ( this[ '_rawObject' ].volume = this.gain );\r
 446                                 },\r
 447                         \r
 448                         actualPause : function(){\r
 449                                 if( !this.playing ) return;\r
 450                                 \r
 451                                 this.seekTime = this.getActualCurrentTime();\r
 452 \r
 453                                 delete this._playTime;\r
 454 \r
 455                         !this[ '_rawObject' ].error && this[ '_rawObject' ].pause();\r
 456                         \r
 457                         if( X_Audio_HTMLAudioWrapper_durationFix && X_UA[ 'Opera' ] ){\r
 458                                 this[ '_rawObject' ].src = '';\r
 459                                 // load();\r
 460                         };\r
 461                         delete this.playing;\r
 462                         },\r
 463                         \r
 464                         getActualCurrentTime : function(){\r
 465                                 return ( X_Audio_HTMLAudioWrapper_currentTimeFix ?\r
 466                                                                 X_Timer_now() - this._playTime + this._beginTime :\r
 467                                                                 this[ '_rawObject' ].currentTime * 1000 | 0 );\r
 468                         },\r
 469                 /*\r
 470                 http://www.w3schools.com/tags/av_prop_error.asp\r
 471                 1 = MEDIA_ERR_ABORTED - fetching process aborted by user\r
 472             2 = MEDIA_ERR_NETWORK - error occurred when downloading\r
 473             3 = MEDIA_ERR_DECODE - error occurred when decoding\r
 474             4 = MEDIA_ERR_SRC_NOT_SUPPORTED - audio/video not supported\r
 475             */                  \r
 476                         getActualError : function(){\r
 477                                 return this[ '_rawObject' ].error || 0;\r
 478                         },\r
 479                         \r
 480                         afterUpdateState : function( result ){\r
 481                                 if( result & 3 ){ // seek\r
 482                         this.actualPlay();\r
 483                                 } else\r
 484                                 if( result & 4 ){\r
 485                        this[ '_rawObject' ].volume = X_Audio_HTMLAudioWrapper_ieMobile9Fix ? 1 : this.gain;\r
 486                                 };                              \r
 487                         }\r
 488         \r
 489                 }\r
 490         );\r
 491         \r
 492         X_Audio_BACKENDS.push(\r
 493                 {\r
 494                         backendName : 'HTML Audio',\r
 495                         \r
 496                         canPlay : X_Audio_codecs,\r
 497                 /*\r
 498                  * HTML5 の audio 要素と video 要素でサポートされているメディアフォーマット\r
 499                  * https://developer.mozilla.org/ja/docs/Web/HTML/Supported_media_formats\r
 500                  * \r
 501                  * 主要ブラウザのHTML5 audioタグで使えるファイル形式の再生対応状況を調べてみた\r
 502                  * http://sothis.blog.so-net.ne.jp/2010-10-27\r
 503                  * ダメ元で仕様に含まれていない SHOUTcast もテストしてみました。\r
 504                  * \r
 505                  * IE9 の HTML5 Audio について\r
 506                  * http://kentablog.cluscore.com/2011/05/ie9-html5-audio.html\r
 507                  * 1.Audioオブジェクトを作ることができないので、Audioタグを使う\r
 508                  * 2.クロスドメインアクセスには、「clientaccesspolicy.xml」か「crossdomain.xml」が必要\r
 509                  * 3.wav が不可\r
 510                  * \r
 511                  * IE9でHTML5 autio タグが無効になる\r
 512                  * http://bbs.wankuma.com/index.cgi?mode=al2&namber=64886&KLOG=109\r
 513                  *  IEのバージョン9.0.8112.16421では、Audioオブジェクトのnewも対応してました。\r
 514                  *  createElement等で動的生成すると、よろしくない\r
 515                  * \r
 516                  * media-can-play-wav-audio.html\r
 517                  * https://github.com/adobe/webkit/blob/master/LayoutTests/media/media-can-play-wav-audio.html\r
 518                  * testExpected("audio.canPlayType('audio/wav; codecs=1')", "probably");\r
 519                  * \r
 520                  * HTML5 audioタグ ブラウザ間の違い\r
 521                  * 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\r
 522                  *  - volume, muted iPhone(iOS4-6)、Android(2.3.6)では動作せず。\r
 523                  *  - FireFox3.6, Android 2.3.6については、src変更後、load()を呼び出さないと切り替わらなかった。iPhoneはload()が不要。\r
 524                  */     \r
 525                         detect : function( proxy, source, ext ){\r
 526                                 proxy[ 'asyncDispatch' ]( { type : X_EVENT_COMPLETE, canPlay : X_Audio_codecs[ ext ] } );\r
 527                         },\r
 528                         \r
 529                         klass : X_Audio_HTMLAudioWrapper\r
 530                         \r
 531                 } );\r
 532 \r
 533 /*\r
 534  * \r
 535  * howler.js\r
 536  *     codecs = {\r
 537       mp3: !!audioTest.canPlayType('audio/mpeg;').replace(/^no$/, ''),\r
 538       opus: !!audioTest.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/, ''),\r
 539       ogg: !!audioTest.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ''),\r
 540       wav: !!audioTest.canPlayType('audio/wav; codecs="1"').replace(/^no$/, ''),\r
 541       aac: !!audioTest.canPlayType('audio/aac;').replace(/^no$/, ''),\r
 542       m4a: !!(audioTest.canPlayType('audio/x-m4a;') || audioTest.canPlayType('audio/m4a;') || audioTest.canPlayType('audio/aac;')).replace(/^no$/, ''),\r
 543       mp4: !!(audioTest.canPlayType('audio/x-mp4;') || audioTest.canPlayType('audio/mp4;') || audioTest.canPlayType('audio/aac;')).replace(/^no$/, ''),\r
 544       weba: !!audioTest.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, '')\r
 545     };\r
 546  */\r
 547         \r
 548 };\r
 549 \r
 550 \r
 551 \r
 552 \r
 553 \r