OSDN Git Service

Version 0.6.149, fix X.Audio & X.UI.
[pettanr/clientJs.git] / 0.6.x / js / 07_audio / 02_XHTMLAudio.js
index 6da87e2..fcf91f4 100644 (file)
@@ -10,7 +10,7 @@ var X_Audio_HTMLAudio_playTrigger =
                X_UA[ 'iOS' ]      ? 'suspend' :\r
                X_UA[ 'AndroidBrowser2' ] ? 'stalled' : // Android 2.3.5(SBM101SH) では stalled は発生しない,,,\r
                X_UA[ 'AndroidBrowser4' ] ? 'loadeddata' : \r
-               X_UA[ 'OperaMobile' ] || X_UA[ 'OperaTablet' ] ? 'loadeddata' : 'canplay',\r
+               X_UA[ 'OperaMobile' ] || X_UA[ 'OperaTablet' ] ? 'loadeddata' : 'loadeddata', //'canplay',\r
        X_Audio_HTMLAudioWrapper,\r
        X_Audio_constructor = window[ 'Audio' ] || window.HTMLAudioElement,\r
        X_Audio_rawAudio,\r
@@ -30,7 +30,8 @@ var X_Audio_HTMLAudio_playTrigger =
        X_Audio_HTMLAudioWrapper_ieMobile9Fix    = ( X_UA[ 'WinPhone' ] && X_UA[ 'IE9' ] ),\r
        X_Audio_HTMLAudioWrapper_durationFix     = ( !X_Audio_HTMLAudioWrapper_currentTimeFix && 12 <= X_UA[ 'Opera' ] ),\r
        \r
-       X_Audio_HTMLAudioWrapper_shortPlayFix    = X_UA[ 'AndroidBrowser2' ],\r
+       X_Audio_HTMLAudioWrapper_shortPlayFix    = //X_UA[ 'AndroidBrowser2' ],\r
+                                                                                               X_UA[ 'AndroidBrowser' ] && X_UA[ 'AndroidBrowserWebkit' ] < 534.3, // Android 4.1.1 でも遭遇\r
        \r
        X_Audio_codecs;\r
 \r
@@ -71,27 +72,10 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                };\r
        };\r
        \r
-       X_Audio_HTMLAudioWrapper = X_EventDispatcher[ 'inherits' ](\r
+       X_Audio_HTMLAudioWrapper = X_Audio_AbstractAudioBackend[ 'inherits' ](\r
                'X.AV.HTML5AudioWrapper',\r
                X_Class.POOL_OBJECT,\r
                {\r
-                       \r
-                       proxy           : null,\r
-                       \r
-                       startTime       : 0,\r
-                       endTime         : -1,\r
-                       loopStartTime   : -1,\r
-                       loopEndTime     : -1,\r
-                       seekTime        : -1,\r
-                       duration        : 0,\r
-                       \r
-                       playing         : false,\r
-                       error           : 0,                    \r
-                       loop            : false,\r
-                       looped          : false,\r
-                       autoplay        : false,\r
-                       volume          : 0.5,\r
-\r
                        _playTime        : 0,\r
                        _closed          : true,\r
                        _loaded          : false,\r
@@ -100,26 +84,26 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                        _lastCurrentTime : 0,\r
                        _src             : '',\r
                        \r
-                       Constructor : function( proxy, source, option ){\r
+                       Constructor : function( target, source, option ){\r
                                var raw;\r
                                \r
-                               this.proxy   = proxy;\r
+                               this.target  = target || this;\r
                                this._closed = false;\r
                                \r
-                               X_AudioWrapper_updateStates( this, option );\r
+                               this.setState( option );\r
 \r
                                if( option[ 'useVideo' ] ){\r
-                                       this[ '_rawObject' ] = raw = document.createElement( 'video' );\r
+                                       this[ '_rawObject' ]  = raw = document.createElement( 'video' );\r
                        raw.preload           = 'none'; // auto, metadata, none\r
                        //raw.autoplay = false, // no-auto\r
-                       raw.loop     = false;\r
-                       raw.muted    = false;\r
-                       //raw.crossorigin       = option[ 'crossorigin' ] || ''; //crossorigin: "anonymous", X.URL.isSameDomain() で切り替え\r
+                       raw.loop              = false;\r
+                       raw.muted             = false;\r
+                       raw.crossorigin       = option[ 'crossorigin' ] || ''; //crossorigin: "anonymous", X.URL.isSameDomain() で切り替え\r
                        raw.style.cssText     = 'position:absolute;bottom:0;left:-50px;width:100px;height:100px;opacity:0;';\r
                                        raw.controls          = false;\r
                                        raw.WebKitPlaysInline = true;\r
                                        raw.src               = source;\r
-                                       //raw.onclick  = "alert('play');this.play();";\r
+                                       //raw.onclick  = "alert('play');this.actualPlay();";\r
                                        document.body.appendChild( raw );\r
                                        //raw.load();\r
                                } else {\r
@@ -159,6 +143,17 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                switch( e.type ){\r
 \r
                                        case X_EVENT_KILL_INSTANCE :\r
+                                               // 【javascript】モバイル向けブラウザでも音を鳴らしたい【WebAudio】\r
+                                               // http://ingaouhou.com/archives/3633\r
+                                               // ・使い終わったインスタンスはload()しておくとやや安定\r
+                                               this.playing && this.actualPause();\r
+                                               delete this._closed;\r
+                                               delete this._loaded;\r
+                                               \r
+                                               this[ '_rawObject' ].src = '';\r
+                                               this[ '_rawObject' ].load();\r
+                                               \r
+                                               // removeChild for video\r
                                                break;\r
                                };\r
                        },\r
@@ -170,7 +165,7 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                \r
                                X_Audio_HTMLAudioWrapper_badOperaAndroid && alert( e.type );\r
                                \r
-                               console.log( e.type );\r
+                               //console.log( e.type );\r
                                \r
                                switch( e.type ){\r
                                        case 'loadstart' :      //      ブラウザがコンテンツの検索を開始した場合に発生\r
@@ -230,11 +225,11 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                                break;\r
                                                \r
                                        case 'ended' :\r
-                                               if( !this._closed && this.loop ){\r
-                                                       if( !( this.proxy[ 'dispatch' ]( X_EVENT_MEDIA_BEFORE_LOOP ) & X_Callback_PREVENT_DEFAULT ) ){\r
+                                               if( !this._closed && this.autoLoop ){\r
+                                                       if( !( this.target[ 'dispatch' ]( X_EVENT_MEDIA_BEFORE_LOOP ) & X_Callback_PREVENT_DEFAULT ) ){\r
                                                                this.looped = true;\r
-                                                               this.proxy[ 'dispatch' ]( X_EVENT_MEDIA_LOOPED );\r
-                                                               this.play();\r
+                                                               this.target[ 'dispatch' ]( X_EVENT_MEDIA_LOOPED );\r
+                                                               this.actualPlay();\r
                                                        };\r
                                                        return;\r
                                                };\r
@@ -250,11 +245,6 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                                                if( !this.duration && X_Type_isFinite( this[ '_rawObject' ].duration ) ){\r
                                                                        this.duration = this.duration || this[ '_rawObject' ].duration * 1000;\r
                                                                        this._playForDuration = 2;\r
-                                                                       \r
-                                                       //this.proxy[ 'asyncDispatch' ]( 'loadedmetadata' );\r
-                                                       //this.proxy[ 'asyncDispatch' ]( 'loadeddata' );\r
-                                                       //this.proxy[ 'asyncDispatch' ]( 'canplay' );\r
-                                                       //this.proxy[ 'asyncDispatch' ]( 'canplaythrough' );\r
                                                        loaded = true;\r
                                                        //console.log( 'durationFix が完了' + this.duration );\r
                                                        break;\r
@@ -264,8 +254,8 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                                                };\r
                                                        } else\r
                                                        if( this[ '_rawObject' ].currentTime === this._lastCurrentTime ){\r
-                                                               //this.proxy[ 'dispatch' ]( 'seeking' );\r
-                                                               this.proxy[ 'dispatch' ]( X_EVENT_MEDIA_WAITING );\r
+                                                               //this.target[ 'dispatch' ]( 'seeking' );\r
+                                                               this.target[ 'dispatch' ]( X_EVENT_MEDIA_WAITING );\r
                                                                return;\r
                                                        };\r
                                                        this._lastCurrentTime = this[ '_rawObject' ].currentTime;\r
@@ -274,17 +264,18 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
 \r
                                    if( this.playing ){\r
                                        end = X_AudioWrapper_getEndTime( this );\r
-                                       now = X_Audio_HTMLAudioWrapper_currentTimeFix ? X_Timer_now() - this._playTime + this._beginTime : this[ '_rawObject' ].currentTime * 1000 | 0;\r
+                                       now = this.getActualCurrentTime();\r
+                                       //console.log( end + ' / ' + now );\r
                                        if( 0 + end <= 0 + now ){ // なぜか iem9 で必要,,,\r
-                                               if( this.loop ){\r
-                                                       if( !( this.proxy[ 'dispatch' ]( X_EVENT_MEDIA_BEFORE_LOOP ) & X_Callback_PREVENT_DEFAULT ) ){\r
+                                               if( this.autoLoop ){\r
+                                                       if( !( this.target[ 'dispatch' ]( X_EVENT_MEDIA_BEFORE_LOOP ) & X_Callback_PREVENT_DEFAULT ) ){\r
                                                                this.looped = true;\r
-                                                               this.proxy[ 'dispatch' ]( X_EVENT_MEDIA_LOOPED );\r
-                                                               this.play();\r
+                                                               this.target[ 'dispatch' ]( X_EVENT_MEDIA_LOOPED );\r
+                                                               this.actualPlay();\r
                                                        };\r
                                                } else {\r
-                                                       this.pause();\r
-                                                       this.proxy[ 'dispatch' ]( X_EVENT_MEDIA_ENDED );\r
+                                                       this.actualPause();\r
+                                                       this.target[ 'dispatch' ]( X_EVENT_MEDIA_ENDED );\r
                                                };\r
                                                return;\r
                                        };\r
@@ -318,14 +309,7 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                                                        console.log( '設定 ' + this._beginTime );\r
                                                                        return;\r
                                                                };\r
-                                                               \r
-                                                               /*\r
-                                               this.proxy[ 'asyncDispatch' ]( 'loadedmetadata' );\r
-                                               this.proxy[ 'asyncDispatch' ]( 'loadeddata' );\r
-                                               this.proxy[ 'asyncDispatch' ]( 'canplay' );\r
-                                               this.proxy[ 'asyncDispatch' ]( 'canplaythrough' ); */\r
-                                              \r
-                                               \r
+\r
                                                loaded = true;\r
                                                console.log( 'durationFix が完了' + this.duration );\r
                                                \r
@@ -348,27 +332,18 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                if( !this._loaded && ( loaded || e.type === X_Audio_HTMLAudio_playTrigger || e.type === 'loadeddata' ) ){\r
                                        this.autoplay && X_Timer_once( 16, this, this.play );\r
                                        this._loaded = true;\r
-                                       this.proxy[ 'dispatch' ]( X_EVENT_READY );\r
+                                       this.target[ 'asyncDispatch' ]( X_EVENT_READY );\r
                                        console.log( 'Loaded! ' + e.type + ' d:' + ( this.duration | 0 ) );\r
                                        return;\r
                                };\r
                                \r
-                               loaded || ( type && this.proxy[ 'dispatch' ]( type ) );\r
-                       },\r
-                       \r
-                       close : function(){\r
-                               // 【javascript】モバイル向けブラウザでも音を鳴らしたい【WebAudio】\r
-                               // http://ingaouhou.com/archives/3633\r
-                               // ・使い終わったインスタンスはload()しておくとやや安定\r
-                               this.playing && this.pause();\r
-                               delete this._closed;\r
-                               delete this._loaded;\r
-                               \r
-                               this[ '_rawObject' ].src = '';\r
-                               this[ '_rawObject' ].load();\r
+                               if( !loaded && type ){\r
+                                       this.target[ 'dispatch' ]( type );\r
+                                       type === X_EVENT_ERROR && this[ 'kill' ]();\r
+                               };\r
                        },\r
-                       \r
-                       play : function(){\r
+\r
+                       actualPlay : function(){\r
                                var begin, end;\r
                                \r
                                // もし kill 後に autoplayTimer で呼ばれても、_closed==true なので平気\r
@@ -397,14 +372,13 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                        delete this._playForDuration;\r
                                };\r
 \r
-                           \r
                            if( !this.playing ){\r
                                    if( X_UA[ 'Chrome' ] ){ // [CHROME][FIX] volume TODO どの version で 修正される?\r
                                        // [!] delay\r
                                        X_Timer_once( 0, this, this._fixForChrome );\r
                                        this[ '_rawObject' ].volume = 0;\r
                                    } else {\r
-                                       this[ '_rawObject' ].volume = this.volume;\r
+                                       this[ '_rawObject' ].volume = this.gain;\r
                                    };\r
                                this[ '_rawObject' ].play();\r
                                this.playing = true;\r
@@ -425,13 +399,13 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                                \r
                                // [CHROME][FIX] volume\r
                                _fixForChrome : X_UA[ 'Chrome' ] && function(){\r
-                                       !this._closed && ( this[ '_rawObject' ].volume = this.volume );\r
+                                       !this._closed && ( this[ '_rawObject' ].volume = this.gain );\r
                                },\r
                        \r
-                       pause : function(){\r
+                       actualPause : function(){\r
                                if( !this.playing ) return;\r
                                \r
-                               this.seekTime = this.state().currentTime;\r
+                               this.seekTime = this.getActualCurrentTime();\r
 \r
                                delete this._playTime;\r
 \r
@@ -443,55 +417,30 @@ if( X_Audio_constructor && !X_Audio_HTMLAudioWrapper_badOperaAndroid ){
                        };\r
                        delete this.playing;\r
                        },\r
-       \r
-                       state : function( obj ){\r
-                               var result;\r
-                               \r
-                               if( obj === undefined ){\r
-                                   return {\r
-                                       startTime     : this.startTime,\r
-                                       endTime       : this.endTime < 0 ? this.duration : this.endTime,\r
-                                       loopStartTime : this.loopStartTime < 0 ? this.startTime : this.loopStartTime,\r
-                                       loopEndTime   : this.loopEndTime < 0 ? ( this.endTime || this.duration ) : this.loopEndTime,\r
-                                       \r
-                                       loop          : this.loop,\r
-                                       looped        : this.looped,\r
-                                       volume        : this.volume,\r
-                                       playing       : this.playing, // && !this[ '_rawObject' ].error && !this[ '_rawObject' ].paused && !this[ '_rawObject' ].ended,                         \r
-                                       duration      : this.duration,\r
-                                       \r
-                                       currentTime   :\r
-                                               this.playing ?\r
-                                                       ( X_Audio_HTMLAudioWrapper_currentTimeFix ?\r
+                       \r
+                       getActualCurrentTime : function(){\r
+                               return ( X_Audio_HTMLAudioWrapper_currentTimeFix ?\r
                                                                X_Timer_now() - this._playTime + this._beginTime :\r
-                                                               this[ '_rawObject' ].currentTime * 1000 | 0 ) :\r
-                                                       this.seekTime,\r
-                                       /*\r
-       http://www.w3schools.com/tags/av_prop_error.asp\r
-       1 = MEDIA_ERR_ABORTED - fetching process aborted by user\r
-    2 = MEDIA_ERR_NETWORK - error occurred when downloading\r
-    3 = MEDIA_ERR_DECODE - error occurred when decoding\r
-    4 = MEDIA_ERR_SRC_NOT_SUPPORTED - audio/video not supported\r
-    */\r
-                                       error         : this[ '_rawObject' ].error || 0   // 0, 1 ~ 4 \r
-                                   };                                  \r
-                               };\r
+                                                               this[ '_rawObject' ].currentTime * 1000 | 0 );\r
+                       },\r
+               /*\r
+               http://www.w3schools.com/tags/av_prop_error.asp\r
+               1 = MEDIA_ERR_ABORTED - fetching process aborted by user\r
+           2 = MEDIA_ERR_NETWORK - error occurred when downloading\r
+           3 = MEDIA_ERR_DECODE - error occurred when decoding\r
+           4 = MEDIA_ERR_SRC_NOT_SUPPORTED - audio/video not supported\r
+           */                  \r
+                       getActualError : function(){\r
+                               return this[ '_rawObject' ].error || 0;\r
+                       },\r
                        \r
-                               result = X_AudioWrapper_updateStates( this, obj );\r
-                           \r
-                               if( result & 2 ){ // seek\r
-                       this.play();\r
-                               //} else\r
-                               //if( result & 1 ){\r
-                                       //if( X_Audio_HTMLAudioWrapper_currentTimeFix ){\r
-                                       //      this.play();                                            \r
-                                       //};\r
-\r
+                       afterUpdateState : function( result ){\r
+                               if( result & 3 ){ // seek\r
+                       this.actualPlay();\r
                                } else\r
                                if( result & 4 ){\r
-                      this[ '_rawObject' ].volume = this.volume;\r
-                               };\r
-                           \r
+                      this[ '_rawObject' ].volume = this.gain;\r
+                               };                              \r
                        }\r
        \r
                }\r