OSDN Git Service

Version 0.6.213, add X.Node.TextRange.
[pettanr/clientJs.git] / 0.6.x / js / 07_audio / 02_XHTMLAudio.js
index 786f343..b5abcd2 100644 (file)
@@ -39,8 +39,9 @@
 \r
 var\r
        X_HTMLAudio,\r
-       \r
-       // ended が発生しない timeupdate 内で play() を呼ぶ (未検証) 不具合確認は iOS4,6\r
+       // iOS7.1, 8.3 で確認.seeking -> seeked の間の currentTime の値が全くあてにならないので無視する。\r
+       X_HTMLAudio_seekingFixIOS   = 7 <= X_UA[ 'iOS' ],\r
+       // ended が発生しない timeupdate 内で play() を呼ぶ (未検証) 不具合確認は iOS4,6 iOS7.1,8.3ではpause->ended起きてる 但し iOS7.1 でも 6 と同じ症状になることがある\r
        X_HTMLAudio_endedFixIOS     = X_UA[ 'iOS' ] < 7,\r
        // Android 2.3.5 で ended 時に audio.src='';audio.src=src;audio.load() を実施。 2.3.4 でも問題なし。\r
        X_HTMLAudio_endedFixAOSP2   = X_UA[ 'AOSP' ] < 3,\r
@@ -59,18 +60,25 @@ var
         * win opera12 volume, mute の変更が2度目以降できない\r
         */\r
        X_HTMLAudio_volumeEnabled   = !( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ) && !X_UA[ 'Opera' ],\r
-       // Gecko PC + Android でseek時に再生がしばしば止まる問題の修正\r
+       // Gecko PC + Android でseek時に再生がしばしば止まる問題の修正、iOS8でも確認\r
        X_HTMLAudio_needPlayForSeek = X_UA[ 'iOS' ] || X_UA[ 'Gecko' ],\r
        // \r
        X_HTMLAudio_pauseFix            = 12 <= X_UA[ 'Opera' ] && 0 < ' XP XPSP2 2003|XP64'.indexOf( X_UA[ 'Windows' ] ), // XP + Opera12 のみ?\r
 \r
        X_HTMLAudio_need1stTouch        = X_UA[ 'iOS' ] || 4.2 <= X_UA[ 'AOSP' ] || X_UA[ 'ChromeWV' ] || X_UA[ 'WinPhone' ] || ( X_UA[ 'Blink' ] && X_UA[ 'Android' ] ),\r
+\r
+       X_HTMLAudio_playTrigger     = ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ) ? 'canplay' :\r
+                                                                       X_UA[ 'iOS' ] < 8 ? 'suspend' :    // iOS7.x以下\r
+                                                                       X_UA[ 'iOS' ] ? 'loadedmetadata' : // iOS8以上は\r
+                                                                       X_UA[ 'Blink' ] < 32 ? 'stalled' : 'canplaythrough',\r
+\r
+       X_HTMLAudio_durationFix     = // iOS8.1(シュミレータでは不要)\r
+                                                                 X_UA[ 'iOS' ] < 8 || X_UA[ 'ChromeWV' ] || ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ) ||\r
+                                                                 ( X_UA[ 'Windows' ] && 12 <= X_UA[ 'Opera' ] ) || ( X_UA[ 'Blink' ] < 36 && X_UA[ 'Android' ] ),\r
+\r
+       X_HTMLAudio_shortPlayFix        = X_UA[ 'AOSP' ],\r
        \r
-       X_HTMLAudio_playTrigger     = ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ) ? 'canplay' : X_UA[ 'iOS' ] ? 'suspend' : X_UA[ 'Blink' ] ? 'stalled' : 'canplaythrough',\r
-       \r
-       X_HTMLAudio_durationFix     = X_UA[ 'iOS' ] || X_UA[ 'ChromeWV' ] || ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ) || ( X_UA[ 'Windows' ] && 12 <= X_UA[ 'Opera' ] ),\r
-       \r
-       X_HTMLAudio_shortPlayFix        = X_UA[ 'AOSP' ]; // Android 4.1.1 でも遭遇\r
+       X_HTMLAudio_progressEnabled = !( X_UA[ 'Opera' ] && X_UA[ 'Android' ] ) && !( X_UA[ 'WinPhones' ] && X_UA[ 'IE9' ] ); // Android 4.1.1 でも遭遇\r
 \r
 if( X_Audio_constructor ){\r
        \r
@@ -78,10 +86,9 @@ if( X_Audio_constructor ){
                'X.HTMLAudio',\r
                X_Class.POOL_OBJECT,\r
                {\r
-                       _closed               : true,\r
-\r
                        // 1: canplaythrought|timeupdateに達している、またはdurationFixが終了している\r
                        // 2: READY イベント発火済\r
+                       // 3: 1, 2 が済\r
                        _readyState       : 0,\r
                        _src                      : '',\r
                        \r
@@ -107,11 +114,12 @@ if( X_Audio_constructor ){
                        \r
                        _endedFixON               : false,\r
                        \r
+                       _seekingFixON     : false,\r
+                       \r
                        'Constructor' : function( disatcher, source, option ){\r
                                var raw;\r
                                \r
                                this.disatcher = disatcher || this;\r
-                               this._closed   = false;\r
                                this._src          = source;\r
                                \r
                                if( X_HTMLAudio_shortPlayFix ){\r
@@ -145,7 +153,8 @@ if( X_Audio_constructor ){
                                                //'loadstart', 'load',\r
                                                'progress', //'error',\r
                                                // 'suspend', 'abort', 'emptied', 'stalled',\r
-                                               // 'play', 'pause', 'seeked', 'ratechange', 'volumechange',\r
+                                               // 'play', 'pause', 'ratechange', 'volumechange',\r
+                                               'seeked',\r
                                                'loadedmetadata', 'loadeddata', 'canplay', 'canplaythrough',\r
                                                'playing', 'waiting', 'seeking',\r
                                                'durationchange', 'timeupdate', 'ended' ] );\r
@@ -160,7 +169,7 @@ if( X_Audio_constructor ){
                                                'durationchange', 'timeupdate', 'ended' ], this.onDebug );\r
 \r
                                if( X_HTMLAudio_endedFixAOSP2 || X_HTMLAudio_endedFixAOSP4 ){\r
-                                       raw.loop = true; // loop を使えば ended で止まること回避できるかも 但し ended イベントが起きなくなる\r
+                                       raw.loop = true; // loop を使えば ended で止まること回避できる 但し ended イベントが起きなくなる\r
                                };\r
 \r
                                if( X_HTMLAudio_need1stTouch ){\r
@@ -192,14 +201,13 @@ if( X_Audio_constructor ){
                                        ready,\r
                                        eventType, duration, end, now;\r
                                \r
-                               if( this._closed ) return;\r
+                               if( !raw ) return;\r
 \r
                                //e.type !== 'timeupdate' && console.log( ' > ' + e.type );\r
                                        \r
                                switch( e.type ){\r
 \r
                                        case X_EVENT_KILL_INSTANCE :\r
-                                               delete this._closed;\r
                                                this.playing && this.actualPause();\r
                                                \r
                                                // 【javascript】モバイル向けブラウザでも音を鳴らしたい【WebAudio】\r
@@ -217,7 +225,7 @@ if( X_Audio_constructor ){
                                                // console.log( e.loaded + ' ' + e.total * 100 + '%' );\r
                                                // iem9 で常に0 raw.networkState;\r
                                                // opera Android 12 で buffered.end() へのアクセスはエラー try catch も無効、iem9 は常に end(0) = 0\r
-                                               if( !( X_UA[ 'Opera' ] && X_UA[ 'Android' ] ) && !( X_UA[ 'WinPhones' ] && X_UA[ 'IE9' ] ) && this.duration ){\r
+                                               if( X_HTMLAudio_progressEnabled && this.duration && this._readyState < 3 ){\r
                                                        buf  = raw.buffered;\r
                                                        time = 0;\r
                                                        for( i = 0, l = buf.length; i < l; ++i ){\r
@@ -233,7 +241,7 @@ if( X_Audio_constructor ){
                                                        this._readyState |= 1;\r
                                                };\r
                                        case 'canplay' :                //      今すぐに再生を再開できるが、バッファリングが不十分でコンテンツを最後まで表示できないと予測している場合に発生\r
-                                               if( this._durationFixPhase === 1 && !X_HTMLAudio_need1stTouch ){\r
+                                               if( this._durationFixPhase === 1 && !X_HTMLAudio_need1stTouch ){ // PC Opera12 用 durationFix\r
                                                        this._durationFixPhase = 2;\r
                                                        this.actualPlay();\r
                                                        raw.currentTime = 0; // Win8 + Opera12 で必要\r
@@ -252,6 +260,9 @@ if( X_Audio_constructor ){
        \r
                                        // TODO firefox で 短い音声でtimeupdate, ended が発火しない <- 最後の音に無音部分を追加する\r
                                        case 'timeupdate' :      //     通常の再生が行われ現在の再生位置の変化が起こった場合に発生\r
+                                               if( this._seekingFixON ){\r
+                                                       eventType = X_EVENT_MEDIA_SEEKING;\r
+                                               } else\r
                                                if( this._durationFixPhase === 8 ){\r
                                                        this._durationFixPhase = 0;\r
                                                        this._readyState |= 1;\r
@@ -269,11 +280,17 @@ if( X_Audio_constructor ){
                                                } else\r
                                                if( this.playing ){\r
                                                        end = X_Audio_getEndTime( this ) + this._shortPlayFixTime;\r
-                                                       //console.log( now + ' / ' + end );\r
+                                                       \r
+                                                       console.log( now + ' / ' + end );// Firefox44.0.2 で音声の再生開始に難あり...\r
+                                                       \r
                                                        if( ( 0 + end <= 0 + now ) || // 0+ なぜか iem9 で必要,,,\r
-                                                               ( now < this._lastCurrentTime ) ){ // loop した場合\r
+                                                               ( now < this._lastCurrentTime && now < 2000 ) ){\r
+                                                               //( ( X_HTMLAudio_endedFixAOSP2 || X_HTMLAudio_endedFixAOSP4 ) && ( now < this._lastCurrentTime && now < 1000 ) ) ){\r
+                                                                       // loop して0付近に戻った場合\r
+                                                                       // iOS8.4 ではこのタイミングで now が last より 0.1秒後退している場合がある\r
+                                                                       // iOS7.1 ではもっと小さい場合がある,,,\r
                                                                if( this.autoLoop ){\r
-                                                                       console.log( '☆★☆ 曲の最後に到達 @timeupdate now-end:' + ( now - end ) );\r
+                                                                       console.log( '☆★☆ 曲の最後に到達 @timeupdate now-end:' + ( now - end ) + ' now:' + now + ' last:' + this._lastCurrentTime );\r
                                                                        ended = true;\r
                                                                        //if( X_HTMLAudio_endedFixIOS ) actualEnded = true;\r
                                                                } else {\r
@@ -310,21 +327,26 @@ if( X_Audio_constructor ){
                                                eventType = !this._durationFixPhase && !this._endedFixON ? X_EVENT_MEDIA_PLAYING : X_EVENT_MEDIA_WAITING;\r
                                        //case 'play' :            //   再生が開始された。play()メソッドからの復帰後に発生する場合に発生\r
                                        //case 'pause' :                  //    再生が一時停止された。pauseメソッドからの復帰後に発生する場合に発生\r
-                                       //case 'seeked' : \r
                                        //case 'ratechange' :    // defaultPlaybackRate属性とplaybackRate属性のどちらかが更新された場合に発生\r
                                        //case 'volumechange' :   // volume属性とmuted属性のどちらかが変化した場合に発生\r
                                                break;\r
+\r
+                                       case 'seeking' :                //      シークがtrueに変化し、イベントを発生させるのに十分な時間がシーク操作にかかっている場合に発生\r
+                                               eventType = X_EVENT_MEDIA_SEEKING;\r
+                                               if( X_HTMLAudio_seekingFixIOS ) this._seekingFixON = true;\r
+                                               break;                                  \r
+                                       case 'seeked' :\r
+                                               if( X_HTMLAudio_seekingFixIOS ) this._seekingFixON = false;\r
+                                               break;\r
                                        \r
                                        case 'waiting' :                //      次のフレームが利用不可のため再生を停止したが、そのフレームがやがて利用可能になると想定している場合に発生\r
                                                eventType = X_EVENT_MEDIA_WAITING;\r
                                                break;\r
-                                       case 'seeking' :                //      シークがtrueに変化し、イベントを発生させるのに十分な時間がシーク操作にかかっている場合に発生\r
-                                               eventType = X_EVENT_MEDIA_SEEKING;\r
-                                               break;\r
                                };\r
                                \r
                                // duration は Infinity, NaN, 0 の場合があるため、これを除外する\r
-                               if( 0 < duration && X_Type_isFinite( duration ) ){\r
+                               // chrome18 for Android は duration = 100 の間はシークができない? 28 は可能\r
+                               if( 0 < duration && X_Type_isFinite( duration ) && duration !== 100 ){\r
                                        this.duration = duration * 1000;\r
 \r
                                        if( this._durationFixPhase === 4 ){\r
@@ -333,7 +355,6 @@ if( X_Audio_constructor ){
                                                \r
                                                if( this.autoplay || this._playReserved ){\r
                                                        console.log( '☆ 再生 <- DurationFix の終了' );\r
-                                                       delete this._playReserved;\r
                                                        this.actualPlay();\r
                                                } else\r
                                                if( X_HTMLAudio_pauseFix ){\r
@@ -367,7 +388,7 @@ if( X_Audio_constructor ){
                                        };\r
                                } else\r
                                if( this._readyState === 1 && this.duration ){\r
-                                       this._readyState = 3;\r
+                                       this._readyState |= 2;\r
                                        this.disatcher[ 'asyncDispatch' ]( X_EVENT_READY );\r
                                        console.log( '> Audio Loaded!! ' + e.type + ' d:' + ( this.duration | 0 ) );\r
                                } else\r
@@ -380,13 +401,20 @@ if( X_Audio_constructor ){
                                var raw = this[ '_rawObject' ],\r
                                        e, begin, end;\r
 \r
-                               if( this._closed ) return;\r
+                               if( !raw ) return;\r
                                \r
-                               if( !raw.src ){ // X_HTMLAudio_pauseFix によって src が空になっている\r
-                                       console.log( '○ 削除された audio.src の復帰' );\r
-                                       raw.src = this._src;\r
-                                       return;\r
-                               };                              \r
+                               this._playReserved = true;\r
+                               \r
+                               if( X_HTMLAudio_pauseFix ){\r
+                                       if( !raw.src ){ // X_HTMLAudio_pauseFix によって src が空になっている\r
+                                               console.log( '○ 削除された audio.src の復帰' );\r
+                                               raw.src = this._src;\r
+                                               return;\r
+                                       };\r
+                                       if( this._durationFixPhase < 2 ){\r
+                                               return;\r
+                                       };              \r
+                               };\r
 \r
                                if( this._touchState === 2 ){\r
                                        e = X_EventDispatcher_CURRENT_EVENTS[ X_EventDispatcher_CURRENT_EVENTS.length - 1 ];\r
@@ -397,10 +425,11 @@ if( X_Audio_constructor ){
                                        this._touchState = 3;\r
                                } else\r
                                if( this._readyState !== 3 && this._durationFixPhase < 2 ){\r
-                                       this._playReserved = true;\r
                                        return;\r
                                };\r
                                \r
+                               delete this._playReserved;\r
+                               \r
                                if( this._durationFixPhase & 3 ){ // 1 or 2\r
                                        console.log( '▲ DurationFix の開始' );\r
                                        this._durationFixPhase = 4;\r
@@ -432,7 +461,6 @@ if( X_Audio_constructor ){
                                        } else\r
                                        if( X_HTMLAudio_needPlayForSeek || forcePlay ){\r
                                                raw.play();\r
-                                               //console.log( '[HTMLAudio] currentTime より先.' );\r
                                        };\r
                                        \r
                                        //http://himaxoff.blog111.fc2.com/blog-entry-97.html\r
@@ -481,6 +509,7 @@ if( X_Audio_constructor ){
                        getActualCurrentTime : function(){\r
                                return ( X_HTMLAudio_currentTimeFix ?\r
                                                        X_Timer_now() - this._currentFixStart + this._currentFixBegin :\r
+                                                       this._seekingFixON ? this._lastCurrentTime * 1000 :\r
                                                        this[ '_rawObject' ].currentTime * 1000 | 0 );\r
                        },\r
                /*\r