0.6.x/js/07_audio/10_XAudioSprite.js

   1 \r
   2 /*\r
   3  * http://uupaa.hatenablog.com/entry/2011/12/12/213233\r
   4  * Mobile Opera11 は Audio をサポートするがイベントが取れない\r
   5  * iframe 内で生成して、Audio Sprite の preset で再生できないか？\r
   6  */\r
   7 var X_Audio_Sprite_shouldUse        = window.HTMLAudioElement && ( X_UA.iOS || X_UA.AndroidBrowser || X_UA.OperaMobile || X_UA.OperaTablet ),\r
   8         X_Audio_Sprite_needTouchFirst   = !!X_UA.iOS,\r
   9         X_Audio_Sprite_inTouchAction    = false,\r
  10         X_Audio_Sprite_enableMultiTrack = !( X_UA.iOS < 6 ),\r
  11         X_Audio_Sprite_enableVolume     = window.HTMLAudioElement && ( !X_UA.iOS && !X_UA.AndroidBrowser && !X_UA.OperaMobile && !X_UA.OperaTablet ),\r
  12         X_Audio_Sprite_useVideoForMulti = 4 <= X_UA.AndroidBrowser,\r
  13         X_Audio_Sprite_maxTracks        = X_UA.iOS < 6 ? 1 : X_Audio_Sprite_useVideoForMulti ? 2 : 9,\r
  14         X_Audio_Sprite_lengthSilence    = 10000, // 一番最初の無音部分の長さ\r
  15         X_Audio_Sprite_lengthDistance   = 5000,  // 音間の無音の長さ\r
  16         X_Audio_Sprite_uid              = 0,\r
  17         X_Audio_Sprite_members          = {},\r
  18         X_Audio_Sprite_TEMP             = {\r
  19                 presets     : {},\r
  20                 BGMs        : {},\r
  21                 tracks      : [],\r
  22                 volume      : 1,\r
  23                 bgmTrack    : null,\r
  24                 bgmPosition : 0,\r
  25                 bgmName     : '',\r
  26                 bgmLooped   : false,\r
  27                 bgmPlaying  : false\r
  28         },\r
  29         X_Audio_Sprite_instance;\r
  30 \r
  31 X.Audio.Sprite = {\r
  32         \r
  33         shouldUse        : X_Audio_Sprite_shouldUse,\r
  34         \r
  35         needTouchFirst   : X_Audio_Sprite_needTouchFirst,\r
  36         \r
  37         enableMultiTrack : X_Audio_Sprite_enableMultiTrack,\r
  38         \r
  39         create : function( setting ){\r
  40                 // close()\r
  41                 if( X_Audio_Sprite_instance ){\r
  42                         X_Audio_Sprite_instance.close();\r
  43                 } else {\r
  44                         X_Audio_Sprite_instance = X_Class_override( new X.EventDispatcher(), X_Audio_Sprite_members );\r
  45                 };\r
  46                 X_Audio_Sprite_instance.setup( setting );\r
  47                 return X_Audio_Sprite_instance;\r
  48                 \r
  49         }\r
  50 };\r
  51 \r
  52 // 再生が終わっているもの、終わりかけのものを探す\r
  53 // TODO 終わりかけのもの、と一番古いもの、どちらを再利用するか？または、再利用を待つ。\r
  54 function X_Audio_Sprite_getTrackEnded(){\r
  55         var tracks  = X_Audio_Sprite_TEMP.tracks,\r
  56                 l = tracks.length,\r
  57                 i = 0, track, state, last = 1 / 0, _last, index;\r
  58         \r
  59         for( ; i < l; ++i ){\r
  60                 track = tracks[ i ];\r
  61                 state = track.state();\r
  62                 if( !state.playing ) return track;\r
  63                 if( track === X_Audio_Sprite_TEMP.bgmTrack ) continue;\r
  64                 if( state.currentTime <= X_Audio_Sprite_lengthSilence + X_Audio_Sprite_lengthDistance ) return track;\r
  65                 _last = state.endTime - state.currentTime;\r
  66                 if( _last < last ){\r
  67                         last  = _last;\r
  68                         index = i;\r
  69                 };\r
  70         };\r
  71         return tracks[ index ];\r
  72 };\r
  73 \r
  74 /*\r
  75  * {\r
  76  *       urls      : [ 'xx.ogg', 'xx.mp3' ],\r
  77  *       numTracks : 3,\r
  78  *   useVideo  : false,\r
  79  *   volume    : 1,\r
  80  *       BGM_01 : [ '15.00', '45.500', true, '17.666', '50.999' ],\r
  81  *   BGM_02 : [ '56.00', '1:15.230', true ]\r
  82  * }\r
  83  */\r
  84 \r
  85 X_Audio_Sprite_members = {\r
  86                 \r
  87                 setup : function( setting ){\r
  88                         \r
  89                         var tracks  = X_Audio_Sprite_TEMP.tracks,\r
  90                                 bgms    = X_Audio_Sprite_TEMP.BGMs,\r
  91                                 presets = X_Audio_Sprite_TEMP.presets,\r
  92                                 urls    = setting[ 'urls' ],\r
  93                                 n       = setting[ 'numTracks' ] || 1,\r
  94                                 video   = setting[ 'useVideo' ],\r
  95                                 option  = {\r
  96                                         volume    : setting[ 'volume' ] || 0.5,\r
  97                                         autoplay  : false,\r
  98                                         startTime : 0,\r
  99                                         endTime   : X_Audio_Sprite_lengthSilence,\r
 100                                         loop      : true\r
 101                                 },\r
 102                                 k, i, v, track;\r
 103                         \r
 104                         n = n <= X_Audio_Sprite_maxTracks ? n : X_Audio_Sprite_maxTracks;\r
 105                         \r
 106                         video = video || ( 1 < n && X_Audio_Sprite_useVideoForMulti );\r
 107                         \r
 108                         for( k in setting ){\r
 109                                 v = setting[ k ];\r
 110                                 if( X.Type.isArray( v ) && v !== urls){\r
 111                                         v = X.Object.cloneArray( v );\r
 112                                         for( i = v.length; i; ){\r
 113                                                 --i;\r
 114                                                 if( i !== 2 ) v[ i ] = X_AudioWrapper_timeStringToNumber( v[ i ] );\r
 115                                         };                                      \r
 116                                         if( v[ 2 ] ) bgms[ k ] = v;\r
 117                                         presets[ k ] = v;\r
 118                                 };\r
 119                         };\r
 120                         \r
 121                         for( i = 0; i < n; ++i ){\r
 122                                 if( i === 1 && X_Audio_Sprite_useVideoForMulti ){\r
 123                                         // TODO use <Video>\r
 124                                         tracks.push( X.Audio.create( urls, option ) );\r
 125                                 } else {\r
 126                                         tracks.push( X.Audio.create( urls, option ) );\r
 127                                 };\r
 128                         };\r
 129                         \r
 130                         tracks[ n - 1 ].listenOnce( [ 'backendfound', 'nobackend' ], this, X_Audio_Sprite_handleEvent );\r
 131                         \r
 132                         X_Audio_Sprite_instance.numTracks = n;\r
 133                 },\r
 134                 \r
 135                 close : function(){\r
 136                         var tracks  = X_Audio_Sprite_TEMP.tracks,\r
 137                                 bgms    = X_Audio_Sprite_TEMP.BGMs,\r
 138                                 presets = X_Audio_Sprite_TEMP.presets,\r
 139                                 k;\r
 140                         \r
 141                         while( tracks.length ){\r
 142                                 tracks.pop().kill();\r
 143                         };\r
 144                         \r
 145                         for( k in bgms ){\r
 146                                 delete bgms[ k ];\r
 147                         };\r
 148                         for( k in presets ){\r
 149                                 delete presets[ k ];\r
 150                         };\r
 151                         \r
 152                         X_Audio_Sprite_TEMP.bgmTrack    = null;\r
 153                         X_Audio_Sprite_TEMP.bgmPosition = 0;\r
 154                         X_Audio_Sprite_TEMP.bgmName     = '';\r
 155                         X_Audio_Sprite_TEMP.bgmLooped   = false;\r
 156                         X_Audio_Sprite_TEMP.bgmPlaying  = false;\r
 157                 },\r
 158                 \r
 159                 load : function(){\r
 160                         var tracks = X_Audio_Sprite_TEMP.tracks,\r
 161                                 i = 0, l = tracks.length;\r
 162                         for( ; i < l; ++i ){\r
 163                                 X_AudioProxy_getAudioWrapper( tracks[ i ] )._rawObject.load();\r
 164                         };\r
 165                 },\r
 166                 \r
 167                 /*\r
 168                  * @return uid Number\r
 169                  */\r
 170                 play : function( name ){\r
 171                         var bgm     = X_Audio_Sprite_TEMP.bgmTrack,\r
 172                                 tracks  = X_Audio_Sprite_TEMP.tracks,\r
 173                                 bgms    = X_Audio_Sprite_TEMP.BGMs,\r
 174                                 presets = X_Audio_Sprite_TEMP.presets,\r
 175                                 preset  = presets[ name ],\r
 176                                 i, k;\r
 177                         \r
 178                         if( preset ){\r
 179                                 if( bgms[ name ] ){\r
 180                                         if( name !== X_Audio_Sprite_TEMP.bgmName ){\r
 181                                                 // bgm変更\r
 182                                                 X_Audio_Sprite_TEMP.bgmName     = name;\r
 183                                                 X_Audio_Sprite_TEMP.bgmPosition = preset[ 0 ];\r
 184                                                 X_Audio_Sprite_TEMP.bgmPlaying  = true;\r
 185                                                 X_Audio_Sprite_TEMP.bgmLooped   = false;\r
 186                                         };\r
 187                                         if( bgm ){\r
 188                                                 track = bgm;\r
 189                                         } else\r
 190                                         if( 1 < tracks.length ){\r
 191                                                 track = X_Audio_Sprite_TEMP.bgmTrack = X_Audio_Sprite_getTrackEnded();\r
 192                                         } else {\r
 193                                                 track = X_Audio_Sprite_TEMP.bgmTrack = tracks[ 0 ];\r
 194                                         };\r
 195                                         \r
 196                                         if( track.listen( 'looped', this, X_Audio_Sprite_handleEvent ).isPlaying() ){\r
 197                                                 track\r
 198                                                         .state( {\r
 199                                                                 loop          : true,\r
 200                                                                 looped        : X_Audio_Sprite_TEMP.bgmLooped,\r
 201                                                                 currentTime   : X_Audio_Sprite_TEMP.bgmPosition,\r
 202                                                                 startTime     : preset[ 0 ],\r
 203                                                                 endTime       : preset[ 1 ],\r
 204                                                                 loopStartTime : preset[ 3 ],\r
 205                                                                 loopEndTime   : preset[ 4 ]\r
 206                                                         } );\r
 207                                         } else {\r
 208                                                 track\r
 209                                                         .state( { looped : X_Audio_Sprite_TEMP.bgmLooped } )\r
 210                                                         .play( preset[ 0 ], preset[ 1 ], true, preset[ 3 ], preset[ 4 ] )\r
 211                                                         .seek( X_Audio_Sprite_TEMP.bgmPosition );\r
 212                                         };\r
 213                                         \r
 214                                 } else {\r
 215                                         if( 1 < tracks.length ){\r
 216                                                 track = X_Audio_Sprite_getTrackEnded( X_Audio_Sprite_TEMP.bgmPlaying );\r
 217                                                 track\r
 218                                                         .listen( 'looped', this, X_Audio_Sprite_handleEvent )\r
 219                                                         .state( { looped : false } )\r
 220                                                         .play( preset[ 0 ], preset[ 1 ], true, 0, X_Audio_Sprite_lengthSilence );\r
 221                                         } else {\r
 222                                                 // single track, iOS\r
 223                                                 if( bgm ){\r
 224                                                         X_Audio_Sprite_TEMP.bgmPosition = bgm.currentTime();\r
 225                                                         console.log( 'bgm position : ' + X_Audio_Sprite_TEMP.bgmPosition + ' isPlay:' +  bgm.isPlaying() );\r
 226                                                         X_Audio_Sprite_TEMP.bgmTrack    = null;\r
 227                                                 };\r
 228                                                 track = tracks[ 0 ];\r
 229                                         \r
 230                                                 if( track.listen( 'looped', this, X_Audio_Sprite_handleEvent ).isPlaying() ){\r
 231                                                         track\r
 232                                                                 .state( {\r
 233                                                                         loop          : true,\r
 234                                                                         looped        : false,\r
 235                                                                         startTime     : preset[ 0 ],\r
 236                                                                         endTime       : preset[ 1 ],\r
 237                                                                         loopStartTime : 0,\r
 238                                                                         loopEndTime   : X_Audio_Sprite_lengthSilence\r
 239                                                                 } );\r
 240                                                 } else {\r
 241                                                         track\r
 242                                                                 .play( preset[ 0 ], preset[ 1 ], true, 0, X_Audio_Sprite_lengthSilence );       \r
 243                                                 };\r
 244                                         };\r
 245                                 };\r
 246                                 return tracks.indexOf( track );\r
 247                         };\r
 248                         return -1;\r
 249                 },\r
 250                 \r
 251                 pause : function( uid ){\r
 252                         var track = X_Audio_Sprite_TEMP.tracks[ uid ];\r
 253                         if( X_Audio_Sprite_TEMP.bgmTrack === track ){\r
 254                                 X_Audio_Sprite_TEMP.bgmPosition = track.currentTime();\r
 255                                 X_Audio_Sprite_TEMP.bgmPlaying  = false;\r
 256                                 X_Audio_Sprite_TEMP.bgmTrack    = null;\r
 257                         };\r
 258                         console.log( 'pause' );\r
 259                         track && track.play( 0, X_Audio_Sprite_lengthSilence, true, 0, X_Audio_Sprite_lengthSilence ).seek( 0 );\r
 260                         return this;\r
 261                 },\r
 262                 \r
 263                 seek : function( uid, position ){\r
 264                         var track = X_Audio_Sprite_TEMP.tracks[ uid ],\r
 265                                 end;\r
 266                         if( track ){\r
 267                                 delete track.seekTime;\r
 268                                 end = X_AudioWrapper_getEndTime( track );\r
 269                                 position <= end && X_AudioWrapper_getStartTime( track, end ) <= position && track.seek( postion );\r
 270                         };\r
 271                         return this;\r
 272                 },\r
 273                 \r
 274                 volume : function( uid, opt_volume ){\r
 275                         var track, i;\r
 276                         // TODO uid = 0\r
 277                         if( uid === 0 ){\r
 278                                 if( opt_volume === undefined ){\r
 279                                         return X_Audio_Sprite_TEMP.volume;\r
 280                                 };\r
 281                                 for( i = X_Audio_Sprite_TEMP.tracks.length; i; ){\r
 282                                         X_Audio_Sprite_TEMP.tracks[ --i ].volume( opt_volume );\r
 283                                 };\r
 284                                 return this;\r
 285                         };\r
 286                         track = X_Audio_Sprite_TEMP.tracks[ uid ];\r
 287                         if( opt_volume === undefined ){\r
 288                                 return track ? track.volume() : -1;\r
 289                         };\r
 290                         track && track.volume( opt_volume );\r
 291                         return this;\r
 292                 },\r
 293                 \r
 294                 state : function( uid, opt_obj ){\r
 295                         var track = X_Audio_Sprite_TEMP.tracks[ uid ];\r
 296                         // TODO uid = 0\r
 297                         if( opt_obj === undefined ){\r
 298                                 return track ? track.state() : { volume : X_Audio_Sprite_TEMP.volume };\r
 299                         };\r
 300                         track && track.state( opt_obj );\r
 301                         return this;\r
 302                 }\r
 303 };\r
 304 \r
 305 function X_Audio_Sprite_handleEvent( e ){\r
 306         switch( e.type ){\r
 307                 case 'backendfound' :\r
 308                         this.asyncDispatch( e );\r
 309                         e.target.unlisten( 'nobackend', this, X_Audio_Sprite_handleEvent );\r
 310                         \r
 311                         if( e.backendName === 'HTML Audio' ){\r
 312                                 e.target.listen( [ X_Audio_HTMLAudio_playTrigger, 'loadeddata' ], this, X_Audio_Sprite_handleEvent );\r
 313                         } else {\r
 314                                 e.target.listen( 'canplaythrough', this, X_Audio_Sprite_handleEvent );\r
 315                         };\r
 316                         break;\r
 317 \r
 318                 case 'nobackend' :\r
 319                         this.asyncDispatch( e );\r
 320                         e.target.unlisten( 'backendfound', this, X_Audio_Sprite_handleEvent );\r
 321                         break;\r
 322                 \r
 323                 case 'canplaythrough' :\r
 324                 case X_Audio_HTMLAudio_playTrigger :\r
 325                 case 'loadeddata' :\r
 326                         this.asyncDispatch( 'audioSpriteCanPlay' );\r
 327                         break;\r
 328                 \r
 329                 case 'looped' :\r
 330                         if( e.target === X_Audio_Sprite_TEMP.bgmTrack ){\r
 331                                 X_Audio_Sprite_TEMP.bgmLooped = true;\r
 332                         } else {\r
 333                                 // single track | iOS\r
 334                                 if( X_Audio_Sprite_TEMP.bgmPlaying && !X_Audio_Sprite_TEMP.bgmTrack ){\r
 335                                         X_Audio_Sprite_TEMP.bgmTrack = e.target;\r
 336                                         this.play( X_Audio_Sprite_TEMP.bgmName );\r
 337                                         return X.Callback.PREVENT_DEFAULT;\r
 338                                 };\r
 339                         };\r
 340                         break;\r
 341                 \r
 342                 case X.Event.KILL_INSTANCE :\r
 343                         this.close();\r
 344                         break;\r
 345         };\r
 346 };\r